JavaScript输入分钟、秒倒计时技巧总结（附代码）

代码如下：

<div class="container-fluid"> 
 <div class="main-content-inner"> 
 <div class="page-content">
  <div class="page-header"> 
  <form class="form-inline" id="searchform"> 
  <div class="form-group" style="margin-left: 10px;">
   <label>分</label> 
  <input type="text" class="form-control" name="Minute" id="Minute">
   </div> 
  <div class="form-group" style="margin-left: 10px;"> 
  <label>秒</label> 
  <input type="text" class="form-control" name="Second" id="Second">
   </div>
  <button type="button" class="btn btn-purple btn-sm" onclick="ok()"> 开始 </button> 
  </form>
  </div>
  <div class="row" style="height:500px;line-height:500px;vertical-align:middle;font-size:200px;color:red;text-align:center;margin-top:100px"> <p id="listview"></p> 
  </div> 
 </div>
  </div> 
 </div>

 <script>
  var t;
  var Minute;
  var Second; 
  var d;
  function ok() {
   if ($("#Minute").val() == "0" || $("#Minute").val() == "") {
   Minute = 0;
   } else {
   Minute = $("#Minute").val();
   }
   if ($("#Second").val() == "0" || $("#Second").val() == "") {
   Second = 0;
   } else {
   Second = $("#Second").val();
   }
  var min = "";
  if (Minute < 10) {
   min = "0" + Minute;
  } else {
   min = Minute + "";
  }
  var sec = "";
  if (Second < 10) {
   sec = "0" + Second;
  } else {
   sec = Second + "";
  }
  $("#listview").text(min + ":" + sec);
  $(".page-header").hide();
  $("#listview").show();
  setTimeout(function () {
   begin()
  }, 1000);  
  }
  function begin() {  
  if (Second != 0) {
   Second--;
   min = "";
   if (Minute < 10) {
   min = "0" + Minute;
   } else {
   min = Minute + "";
   }
   sec = "";
   if (Second < 10) {
   sec = "0" + Second;
   } else {
   sec = Second + "";
   }
   $("#listview").text(min + ":" + sec);
  } else {
   if (Minute > 0) {
   Minute--;
   Second = 59;
   min = "";
   if (Minute < 10) {
    min = "0" + Minute;
   } else {
    min = Minute + "";
   }
   sec = "";
   if (Second < 10) {
    sec = "0" + Second;
   } else {
    sec = Second + "";
   }
   $("#listview").text(min + ":" + sec);
   } else {
   clearTimeout(t);
   }
  }
  t = setTimeout(function () {
   begin()
  }, 1000)
  }
 </script>

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助~如果有疑问大家可以留言交流，谢谢大家对的支持!

# js # 输入分钟秒 # 倒计时 # js倒计时 # JavaScript深入V8引擎以及编写优化代码的5个技巧 # JS尾递归的实现方法及代码优化技巧 # 2019 年编写现代 JavaScript 代码的5个小技巧(小结) # JavaScript实用代码小技巧 # 几个你不知道的技巧助你写出更优雅的vue.js代码 # js技巧之十几行的代码实现vue.watch代码 # js 奇葩技巧之隐藏代码 # javascript简写常用的12个技巧（可以大大减少你的js代码量） # JavaScript中最常用的10种代码简写技巧总结 # 手机开发必备技巧：javascript及CSS功能代码分享 # JavaScript避免代码的重复执行经验技巧分享 # JavaScript编码小技巧分享 # 这篇文章 # 谢谢大家 # 有疑问 # left # px # margin # searchform # group # style # label # Minute # button # btn # control # input # type # text # id # lt # div

返回目录在线咨询

上一篇：图片优化在SEO中重要吗_SEO优化教程
下一篇：网站服务器缓存优化指南：错误排查与CDN加速策略

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

全网整合营销服务商

JavaScript输入分钟、秒倒计时技巧总结（附代码）

您的项目需求