输入分钟、秒倒计时

 <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>
时间: 2024-10-12 13:28:07

输入分钟、秒倒计时的相关文章

15秒的倒计时和15分钟的倒计时

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <!-- 作者:offline 时间:2017-04-04 描述:15秒的倒计时 --> <span class="span1">00</span>: <span c

yii框架实现注册页面短信验证60秒倒计时

先说下简单的,直接用jquery来实现短信验证60秒倒计时,然后在说明在yii框架下怎么实现的. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

&lt;linux小脚本&gt;10秒倒计时

#!/bin/bash #带颜色的10秒倒计时 for  ((sec=10;sec>=0;sec--)) do echo -ne "\e[1;31myou have $sec seconds to prepared!\e[0m" echo -ne "\r" sleep 1 done echo

验证码60秒倒计时

验证码60秒倒计时(jQuery), 代码如下: //验证码倒计时 var countdown = 60; var st; function settime(element) { if (countdown != 0) { st = setTimeout(function () { settime(element); }, 1000); } if (countdown == 0) { element.removeAttr("disabled"); element.val("获

js jquery 按钮点击后 60秒之后才能点击 60秒倒计时

var wait = 60; function time(o) { if (wait == 0) { $(o).attr("disabled", false); $(o).val("获取验证码"); wait = 60; } else { $(o).attr("disabled", true); o.val(wait + "秒后重新发送"); wait--; setTimeout(function () {time(o);},

js实现60秒倒计时效果(使用了jQuery)

今天碰到要实现一个类似那种短信验证码60秒倒计时的需求,好久不写js,有点手生.把代码记录下,方便后续查阅. 这里我用了jQuey,毕竟写起来简洁点.下面直接看效果和代码. 一.效果 二.代码 (1)html <input type="button" id="btn" value="免费获取验证码" onclick="daojishi(10,this)" /> 注意:要引入JQuery (2)js <scri

淘宝60秒倒计时

<!DOCTYPE html> <html> <head> <title>60秒倒计时</title> <script type="text/javascript"> window.onload=function(){ var oBtn = document.getElementById('but'); var conut = 60; var timer = null; oBtn.onclick=function(

点击按钮出现60秒倒计时js代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

IOS第六天(2:10秒倒计时)

****************10秒倒计时 #import "HMViewController.h" @interface HMViewController () <UIAlertViewDelegate> @property (weak, nonatomic) IBOutlet UILabel *counterLabel; @property (nonatomic, strong) NSTimer *timer; @end @implementation HMViewC

30秒倒计时

1 from tkinter import * 2 counter = 30 3 def run_counter(digit): 4 def counting(): 5 global counter 6 counter -= 1 7 digit.config(text=str(counter)) 8 digit.after(1000,counting) 9 counting() 10 root = Tk() 11 root.title("30秒倒计时") 12 digit=Label(