zoukankan      html  css  js  c++  java
  • 倒计时效果

    知识点:

    1、setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

    2、clearInterval() 方法可取消由 setInterval() 设置的 timeout。

        clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。

    代码
    <!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-Type" content="text/html; charset=utf-8" />
    <title>倒计时</title>
    </head>
    <script>
    var timer = function(id)
    {
    this.objTimer = document.getElementById(id);
    }
    timer.prototype
    =
    {
    init :
    function ()
    {
    var _self = this;
    if(!this.objTimer)
    return;
    this.times = parseInt(this.objTimer.innerHTML);
    if(this.times <= 0)
    {
    this.times = 0;
    }
    this.setTimer();
    this.interval = setInterval(function(){_self.setTimer.call(_self)},1000);

    },
    setTimer :
    function ()
    {
    if(this.times <=0)
    {
    clearInterval(
    this.intervar);
    return;
    }
    this.times--;
    var timeH = parseInt(this.times / 3600);
    var timeM = parseInt(this.times % 3600 / 60);
    var timeS = parseInt(this.times % 3600 % 60 );
    this.objTimer.innerHTML = timeH +":"+ timeM + ":" +timeS;
    }

    }

    </script>
    <body>
    <div id="times_sec">1000</div>

    <div id="times_sec2">500</div>

    <script>
    var aa = new timer ("times_sec");
    var cc = aa.init();
    var bb = new timer ("times_sec2");
    var dd = bb.init();
    </script>
    </body>
    </html>
  • 相关阅读:
    java的final变量理解
    springMVC如何判断入参是默认参数还是请求传过来的参数?
    java反射新的应用
    冒烟测试和回归测试的区别
    git变基、冲突解决
    mockServer学习
    mongodb查询之模糊查询
    springxml配置构造函数入参
    mockito学习
    solr官方文档翻译系列之schema.xml配置介绍
  • 原文地址:https://www.cnblogs.com/attesa/p/1765859.html
Copyright © 2011-2022 走看看