JavaScript

超轻量级php框架startmvc

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

更新时间:2020-05-30 11:42:01 作者:startmvc
代码如下:<divclass="container-fluid"><divclass="main-content-inner"><divclass="page-content"><

代码如下:


<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倒计时