第一个:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>counter</title>
<script language="javascript" type="text/JavaScript">
function Counter(nMax,nInterval)
{
this.maxTime=nMax;
this.interval=nInterval;
this.objId="timer";
this.obj=null;
this.num=this.maxTime;
this.timer=null;
this.start=function()
{
this.obj=document.getElementById(this.objId);
if(this.num>0) setTimeout(this.run,this.interval*1000);
};
this.run=function()
{
if(myCounter.num>0)
{
myCounter.num--;
myCounter.obj.innerHTML=myCounter.num;
myCounter.timer=setTimeout(myCounter.run,myCounter.interval*1000);
}
else clearTimeout(myCounter.timer);
};
this.show=function()
{
document.write("<span id="+this.objId+">"+this.num+"</span>");
this.obj=document.getElementById(this.objId);
//alert(this.obj.innerHTML);
}
}
</script>
</head>
 
<body onload="myCounter.start();">
 
<script language="JavaScript" type="text/JavaScript">
var myCounter=new Counter(10,1);
</script>
 
<p>现在剩下
<script language="JavaScript" type="text/JavaScript">
myCounter.show();
</script>
秒钟!</p>

第二个:很中庸的倒计时,我用的这个

请等待<span id="dd">10</span>秒
<script type="text/javascript">
function run(){
    var s = document.getElementById("dd");
    if(s.innerHTML == 0){
        window.location.href='www.baidu.com';
        return false;
    }
    s.innerHTML = s.innerHTML * 1 - 1;
}
window.setInterval("run();", 1000);
</script>

第三个:毫秒级的,比较紧张:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script type="text/javascript">
    <!--
    var duration=9900;
    var endTime = new Date().getTime() + duration + 100;
    function interval()
    {
        var n=(endTime-new Date().getTime())/1000;
        if(n<0) return;
        document.getElementById("timeout").innerHTML = n.toFixed(3);
        setTimeout(interval, 10);
    }
    window.onload=function()
    {
        setTimeout("window.location.href='http://www.baidu.com'", duration);
        interval();
    }
    //-->
    </script>
<head runat="server">
    <title>等待10秒</title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
             现在剩下 <span id="timeout">10.000</span> 秒后 将自动跳转        </div>
    </form>
</body>
</html>

js 10秒钟倒计时的更多相关文章

  1. js 10秒倒计时 功能

    请等待<span id=</span>秒 <script type="text/javascript"> function run(){ var s ...

  2. 原生js 当前时间 倒计时代码

    源:https://www.oschina.net/code/snippet_2318153_54763 <!DOCTYPE html> <html> <head> ...

  3. JS简单的倒计时(代码优化)

    倒计时网上一大堆,所以也没有什么好说的,支持:1.年,月,日,天,时分秒等倒计时. JS代码如下: /* * js简单的倒计时 * @param {date,obj} 日期 对象格式 */ funct ...

  4. js验证码有效时间倒计时

    js验证码有效时间倒计时 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type& ...

  5. JS实现自动倒计时

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

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

    ****************10秒倒计时 #import "HMViewController.h" @interface HMViewController () <UIA ...

  7. crontab每10秒钟执行一次

    1.使用sleep 在crontab中加入 * * * * * sleep 10; /bin/date >>/tmp/date.txt* * * * * sleep 20; /bin/da ...

  8. 每隔10秒钟打印一个“Helloworld”

    /** * 每隔10秒钟打印一个“Helloworld” */ public class Test03 { public static void main(String[] args) throws ...

  9. js团购倒计时函数代码

    <h1>团购啦!</h1><p>还剩<span id="times"></span></p> <SCR ...

随机推荐

  1. [转]解析json:与array,list,map,bean,xml相互转化

    一.解析json之net.sf.json 下载地址 使用netsfjson需要导入的包 JSONObject JSONArray JavaBean与json字符串互转 List与json字符串互转 M ...

  2. 查看真机的系统版本sdk

    1.adb devices 确保连接上了真机 2.adb shell 进入android系统 3.进入system目录下 4.查看build.prop文件 cat build.prop

  3. linux抓包方法

    tcpdump -i eth0 -X -w data.cap 得到的包保存到本地wireshark解析ip.addr == url && http.request.url contai ...

  4. 夺命雷公狗ThinkPHP项目之----企业网站20之网站前台头尾分离

    我们的网站直接让他头尾进行分离即可: 然后在代码里面找到id 为header的这段代码: 然后将整个div的内容都给弄出来,然后在view里面创建一个Public的目录,然后在创建一个header.h ...

  5. 《zw版·Halcon-delphi系列原创教程》 水果自动分类脚本(机器学习、人工智能)

    <zw版·Halcon-delphi系列原创教程> 水果自动分类脚本(机器学习.人工智能) 前面介绍了超市,流水线,酸奶的自动分类算法,下面再介绍一个水果的自动分类算法. Halcon强大 ...

  6. yii2购物车实现

    1.商品列表中点击加入购物车,则跳转到购物车列表,效果如图所示: 视图代码goods/list.php中.代码如下: <?php echo Html::a('加入购物车',['cart','id ...

  7. ionic之AngularJS扩展 移动开发(视图导航一)

    目录: 内联模板 : script 路由机制 : 状态机 导航视图 : ion-nav-view 模板视图 : ion-view 导航栏 : ion-nav-bar 回退按钮 : ion-nav-ba ...

  8. Elasticsearch--Date math在索引中的使用

    在Elasticsearch,有时要通过索引日期来筛选某段时间的数据,这时就要用到ES提供的日期数学表达式 描述: 特别在日志数据中,只是查询一段时间内的日志数据,这时就可以使用日期数学表达式,这样可 ...

  9. 源码安装apache

    目标:源码安装apache 依赖包:apr.apr-util和pcre.其中pcre正则库要先安装,apr和apr-util(已解压)可以复制到apache下的资源库srclib下. 安装pcre: ...

  10. Java中IO流中所涉及到的各类方法介绍

    IO流之字节流 (1)IO用于在设备间进行数据传输的操作 (2)分类: A:流向 输入流 读取数据 输出流 写出数据 B:数据类型 字节流 字节输入流 字节输出流 字符流 字符输入流 字符输出流 注意 ...