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

    <!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>Jquery实现倒计时效果</title>
    <script language="javascript" src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
     var SysSecond;
     var InterValObj;
     $(document).ready(function() {
      SysSecond = parseInt($("#remainSeconds").html()); //这里我是在服务端算好了剩余的秒数,并保存到客户端,如果过期则返回0
      InterValObj = window.setInterval(SetRemainTime, 1000); //间隔函数,1秒执行
     });

     //代理,接单的时间+1小时减去当前时间的秒数
     function SetRemainTime() {
      if (SysSecond > 0) {
       //alert(SysSecond);
       SysSecond = SysSecond - 1;
       var second = Math.floor(SysSecond % 60);             // 计算秒    
       var minite = Math.floor((SysSecond / 60) % 60);      //计算分
       var hour = Math.floor((SysSecond / 3600) % 24);      //计算小时
       var day = Math.floor((SysSecond / 3600) / 24);        //计算天

       $("#remainTime").html(day + "天" + hour + "小时" + minite + "分" + second + "秒");
      } else {//剩余时间小于或等于0的时候,就停止间隔函数
       window.clearInterval(InterValObj);
      }
     }
    </script>
    </head>

    <body>
    <div id="remainSeconds" style="display:none">18000</div>
    <div id="remainTime" style="font-size:20px;font-weight:800;color:#FF9900"></div>
    </body>
    </html>

  • 相关阅读:
    jquery 菜单1
    Notepad++在vs2008下编译运行
    Linux readelf命令的使用
    Linux下truss、strace或ltrace的使用
    (转载)new和malloc的区别
    windows xp 设置回环网卡
    Linux下没有网线的情况下,从主机使用SSH登录虚拟机
    Linux ELF文件学习(1)
    C++子类继承父类
    (转载)wireshark抓包的时候有黄条、蓝条各代表什么意思?
  • 原文地址:https://www.cnblogs.com/zxjyuan/p/1640707.html
Copyright © 2011-2022 走看看