当前位置：首页 > Web开发 > 正文

jquery倒计时定时器

2024-03-31 Web开发

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src=""></script>

    <style>

        .active{font-size:16px;color:#ffffff;
            background: #000000;padding:10px;}
    </style>

</head>
<body>

数字从1变化到10：<div>0</div>

自动添加类：<div>0000000</div>

3秒后自动添加类：<div>0000000</div>

<script>

    $(function () {

        fn1("#box1");
        fn2("#box2");   //方法执行

        setTimeout("fn2(‘#box3‘)",3000)     //3秒后方法自动执行
    });

    function fn1(selector){
        var num=0;
        timer=setInterval(function(){
            num++;
           // alert(num)
           // var text="<span>"+num+",</span>"
           // $(selector).append(text);    //节点添加
            $(selector).text(num);
            if(num==10){
                clearInterval(timer);   //定时器清除；
            }
        },1000);
    };

    function fn2(selector){
        $(selector).addClass("active");
    };

</script>

jquery倒计时定时器

，

温馨提示: 本文由Jm博客推荐，转载请保留链接: https://www.jmwww.net/file/web/42971.html

上一篇：ajax与重定向
下一篇：在 CSS 中使用三角函数绘制曲线图形及展示动画

jquery倒计时定时器

推荐文章

热门文章

标签

友情链接

关于本站

联系我们

特别鸣谢