推扬网

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
推扬网 门户 经验分享 查看内容

浅谈js的setInterval事件

2020-4-11 13:50| 发布者: admin| 查看: 39| 评论: 0

这篇文章主要介绍了js的setInterval方法的用法以及示例,非常的有用,这里推荐给小伙伴们

setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
setinterval()用法

setInterval(code,millisec[,"lang"])

后面就两个参数code是你的js代码,millisec为时间间隔,以毫秒计


<body>
   <div id="content"  style="position:relative; height:1000px; width:1000px; background-color:#666;">
    <div id="one" style="position:absolute;top:0px; left:0px; height:100px; width:100px; background-color:red;"></div>
    </div>
        <script>
          var one=document.getElementById('one')
          var x=0;
          var y=0;
          var xs=10;
          var ys=10;
          function scroll(){
              x+=xs;
              y+=ys;
              if(x>=document.getElementById('content').offsetWidth-one.offsetWidth-20 || x<=0)
              {
                  xs=-1*xs;
              }
            if(y>=document.getElementById('content').offsetHeight-one.offsetHeight-20 || y<=0)
              {
                  ys=-1*ys;
              }
              one.style.left=x;
              one.style.top=y;
          }
          dt=setInterval(scroll,100);
          one.onmouseover=function(){
          clearInterval(dt);   
          };
          one.onmouseout=function(){
          dt=setInterval(scroll,100);
          };
        </script>
</body>

下面举一个简单的例子。

例1


function show(){ trace("每隔一秒我就会显示一次");}
var sh;sh=setInterval(show,1000);
clearInterval(sh);

例2


<form>
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock(){var t=new Date()
document.getElementById("clock").value=t
}
</script>
</form>
<div id="clock"></div>
<button onclick="int=window.clearInterval(int)">Stop interval</button>


鲜花

握手

雷人

路过

鸡蛋

最新评论

精选推荐
    关闭

    站长推荐上一条 /1 下一条

    QQ|广告服务|网站出售|投稿要求|禁言标准|版权说明|免责声明|手机版|小黑屋|推扬网 ( 粤ICP备18134897号 )

    GMT+8, 2020-7-14 12:24 , Processed in 0.161547 second(s), 31 queries .

    Powered by Discuz! X3.4

    © 2001-2017 Comsenz Inc.

    返回顶部

    为了响应国家互联网安全,本站已和国家网信办举报中心对接。发布内容信息系统会自动记录IP地址、设备信息、行为记录等。如有发生犯罪违法违规行为,我们全部配合有关部门协助调查取证!

    本站部分文字及图片均来自于网络,如侵犯到您的权益,请及时通知我们,我们将及时的处理。

    本站所提供的信息,只供参考之用。本站不保证该等信息的准确性、有效性、及时性或完整性。本站一概毋须以任何方式就任何信息传递或传送的失误、不准确或错误对用户或任何其他人士负任何直接或间接的责任。
    在法律允许的范围内,本站在此声明,不承担用户或任何人士就使用或未能使用本站所提供的信息或任何链接或项目所引致的任何直接、间接、附带、从属、特殊、惩罚性或惩戒性的损害赔偿(包括但不限于收益、预期利润的损失或失去的业务未实现预期的节省)。

    本站中的文章(包括转贴文章)的版权仅归原作者所有,若作者有版权声明的或文章从其它网站(或各种互联网渠道)转载而附带有原所有站的版权声明者,其版权归属以附带声明为准;文章仅代表作者本人的观点,与本站立场无关。