原生JavaScript利用setInterval的一个简单开始暂停的定时器

来源:互联网 发布:修音软件是什么 编辑:程序博客网 时间:2024/06/14 10:09

首先我们先来看看效果(图片自理)
这里写图片描述

下面看一下DOM

<body>    <table>        <tr>            <td>                <img src="number/0.bmp" id="imgLeft">            </td>            <td>                <img src="number/0.bmp" id="imgRight">            </td>        </tr>        <tr>            <td>                <input type="button" value="开始" id="start" onclick="doStart()">            </td>            <td>                <input type="button" value="停止" id="stop" onclick="doStop()" disabled>            </td>        </tr>    </table></body>

然后就是js代码,并没有style样式

<script type="text/javascript">        var timer;        var r=0;        var l=0;        function doStart(){            $("start").disabled=true;            $("stop").disabled=false;            timer=setInterval(go,100);        }        function go(){            r++;            if(r>9){                r=0;                l++;            }               if(l>9){                l=0;            }            $("imgRight").src="number/"+r+".bmp";            $("imgLeft").src="number/"+l+".bmp";        }        function doStop(){            $("start").disabled=false;            $("stop").disabled=true;            clearInterval(timer);        }        function $(id){            return document.getElementById(id);        }    </script>
阅读全文
2 0
原创粉丝点击