码迷,mamicode.com
首页 > Web开发 > 详细

jquery倒计时定时器

时间:2019-11-23 09:35:35      阅读:90      评论:0      收藏:0      [点我收藏+]

标签:meta   func   min   settime   定时器   out   定时   addclass   class   


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/jquery.min.js"></script>
 
    <style>
 
        .active{font-size:16px;color:#ffffff;
            background: #000000;padding:10px;}
    </style>
 
</head>
<body>
 
 
数字从1变化到10:<div id="box1">0</div>
 
自动添加类:<div id="box2">0000000</div>
 
3秒后自动添加类:<div id="box3">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倒计时定时器

标签:meta   func   min   settime   定时器   out   定时   addclass   class   

原文地址:https://www.cnblogs.com/0826sw/p/11915285.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!