js动态改变setInterval的时间

<!DOCTYPE html>
<html>
<head>
    <!--meta name="viewport" content="initial-scale=1.0, user-scalable=no" /-->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>动态改变定时器的周期</title>
    <style type="text/css">
        html{height:100%}
        body{width:60%;height:100%;margin:0px auto;padding:0px}
        #container{height:5%}
    </style>
    <!-- <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=BMgnVpFhGSH7GE8l7qnWhESkeCr12n9v"> -->
    <!-- //v2.0版本的引用方式:src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥" -->
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    </head>

<body>
<div>
    <span>请重新设置刷新时间的</span><input type="text" id="timeVal" value="1">
    <button id="btn">确定</button>
</div>

</body>
<script type="text/javascript">
    var time=$("#timeVal").val()+"000";// 获取到input里面的值
    var timer=setInterval(changeTime,time);// 定时器

    function changeTime() {
        var d=new Date()
        console.log("秒:"+d.getSeconds());
    }
    $("#btn").click(function () {
         time=$("#timeVal").val()+"000";
         clearInterval(timer);
        timer=setInterval(changeTime,time);
    });
</script>

</html>

 

参考网页:https://www.cnblogs.com/carsonwuu/p/9120994.html

自己整理的代码如下:

 

posted @ 2019-03-27 17:46  叶韵  Views(1004)  Comments(0Edit  收藏  举报