JQuery实现setInterval（）方法

最新推荐文章于 2024-08-13 22:02:28 发布

听华

最新推荐文章于 2024-08-13 22:02:28 发布

阅读量5.1k

点赞数

本文链接：https://blog.csdn.net/qq_45741976/article/details/102662754

版权

setInterval()方法

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

    <style>
        .blue{
            width: 200px;
            height: 200px;
            background-color: blue;
           
        }

        .red{
            width: 200px;
            height: 200px;
            background-color:red;
        }


    </style>

</head>
<body>
	
<input class="ting" type="button" value="停止">
<input class="kai" type="button" value="开始">
<div class="blue"></div>
<script type="text/javascript">
//    $(function(){
//        $(".blue").on("click",function(){
//           $(this).toggleClass("red");
//        });
//    });
 var intervar = setInterval(function(){
    $("div").toggleClass("red");
},100);
//停止
       $(function(){
           $(".ting").on("click",function(){
               clearInterval(intervar);

           });

       });
       
       //开始
        $(function(){
           $(".kai").on("click",function(){
               setInterval(function(){
    $("div").toggleClass("red");
},100);
           });

       });
       





</script>
</body>
</html>