倒计时（小时：分钟：秒钟）【JS原生代码】

<body>
   hours:<input type="text" value="02" class="hours">
   minutes:<input type="text" value="00" class="minutes">
   seconds:<input type="text" value="00" class="seconds">

</body>

</html>

var hour = 2,      /* 小时 */
       minute = 0,   /* 分钟 */
       second = 0,    /* 秒钟 */
       time = 59;   /* 交换变量(当分钟为零的情况下调用)*/

//计时器
var timer = setInterval(function () {

//判断分钟是否为零，如果为零调用交换变量
       if (minute != 0) {
           second--;
       } else {
           time--;
       }

//秒钟重置和分钟减减
       if (second == 0) {
           second = 59;
           if (!minute == 0) {
               minuteNode.value = minute--;
           }
       }

//分钟重置和时钟减减
       if (!hour == 0) {
           if (minute == 0) {
               minute = 59;
               hour--;
           }
       }

//获取秒钟,并修饰代码[00:00:00]（根据分钟是否为0判断，来为秒钟赋值）
       if (minute != 0) {
           if (second < 10) {
               secondNode.value = "0" + second;
           } else {
               secondNode.value = second;
           }
       } else {
           if (second < 10) {
               secondNode.value = "0" + time;
           } else {
               secondNode.value = time;
           }
       }

//获取分钟,并修饰代码[00:00:00]
       if (minute < 10) {
           minuteNode.value = "0" + minute;
       } else {
           minuteNode.value = minute;
       }

//获取小时,并修饰代码[00:00:00]
       if (hour < 10) {
           hourNode.value = "0" + hour;
       } else {
           hourNode.value = hour;
       }

//停止
       if (time == 0) {
           secondNode.value = "0" + time;//改变最后一秒的格式[00:00:00]
           clearInterval(timer);
       }

}, 1000);

倒计时（小时：分钟：秒钟）【JS原生代码】相关推荐

经典扫雷——JS原生代码
JS原生写扫雷, 如何不用xy坐标写出扫雷附带思路图 function Mine(tr,td,leinum,num){this.tr=tr;this.td=td;this.arrsy=[];this ...
基于面向对象的图片轮播（js原生代码）
无论你想走多远,你都需要不断地走下去.前端最精华的便是原生的js,这也是我们前端工程师的技术分层的重要指标,也提现这你的代码能力,开发的水平.废话不多说,进入今天的主要分享----基于面向对象思想的图 ...
javascript 将毫秒值转换为天-小时-分钟-秒钟
var start_timeMS = new Date(start_date).getTime(); var end_timeMS = new Date(end_date).getTime(); va ...
jQuery转换JS原生代码
很多的 JavaScript 开发人员,包括我在内,都很喜欢 jQuery.因为它的简单,因为它有很多丰富的插件可供使用,和其它优秀的工具一样,jQuery 让我们开发人员能够更轻松的开发网站和 We ...
js原生代码实现购物车
一.效果展示双击商品,如果购物车没有该商品,添加到购物车中,如果有该商品数量加1. 全选全不选刷新后数据不会消失二.代码展示 1.基础框架 .screen里面展示商品,.cart购物车,商品信息 ...
学做全屏浮动广告 JS 原生代码
<!DOCTYPE HTML> <html><head><title>JS全屏漂浮广告</title> <meta http-equi ...
js原生代码选项卡切换
选项卡功能实现利用class类的方式,实现点击上面单个不同选项,选项设置样式,并且下面对应的区域切换成相应的内容切换tab 1. 给所有选项卡绑定点击事件 2. 清除所有选项选中效果 3. 给当前 ...
使用js原生代码实现类似新闻列表的滚动题目来自4399小游戏2020年前端笔试编程题
新闻列表的滚动循环播放 html代码 CSS代码 Script代码总结题目要求: 要求实现以下页面,其中列表项是滚动循环播放的,而且每次只显示3个,当鼠标经过的时候停止播放,鼠标离开继续播放 co ...
js原生代码编写一个鼠标在页面移动坐标的检测功能，兼容各大浏览器
function mousePosition(e) {//IE9以上的浏览器获取 if (e.pageX || e.pageY) { return {x: e.pageX,y: e.pageY}; } ...

倒计时（小时：分钟：秒钟）【JS原生代码】

倒计时（小时：分钟：秒钟）【JS原生代码】相关推荐

最新文章

热门文章