JS 事件延迟执行_IT百科

延迟执行，一般是用定时器，定时器有两种，一种是setInterval，另一个是setTimeout。

setInterval，是间隔执行，次数为无限次。

setTimeout，是隔一段时间，执行一次。

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

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

setTimeout() 和setInterval() 几乎是一样的，仅执行次数不同和单词不同而已。关闭setTimeout（）是用clearTimeout()

下面举一个setInterval的例子，仅供参考：

<style>

div {width:100px height:100px position:absolute top:50px left:50px background:#ccc}

</style>

window.onload=function(){

var oDiv = document.getElementById('div1')

var nLeft = parseInt(oDiv.currentStyle?oDiv.currentStyle.left:getComputedStyle(oDiv,false).left)

var timer = setInterval(function(){ //开启定时器，

nLeft++

document.title=nLeft

oDiv.style.left=nLeft+'px'

if(nLeft == 500)

{

clearInterval(timer) //当left值为500时，关闭定时器。

}

},30)

}

</script>

</head>

<body>

js 的单双击事件同时存在会有一个问题：双击事件会同时触发单击事件，两个事件存在冲突。

我们加一个延迟时间就能很好的解决这个问题。

原理：当接收到第一个点击时，我们先把单击事件存储在这个是全局变量 click_store 里，如果 0.3 秒内没有接收到双击事件，就去执行它，如果接收到了，我们把它清理掉，然后去执行双击事件。setTimeout() 可以实现延迟执行。

onload事件就是在部件装载完毕后才触发的啊。

不过你这个貌似无须用Javascript来完成啊，

你可以把display:none直接放到图片的css中，不要用javascript语句img.style.display="none"

这样的话图片总是先显示出来，再隐藏，再改变大小，再显示，就没意义了。

放在css中的话，图片一开始就隐藏，改变大小后再显示出来，就能达到你的要求了。

欢迎分享，转载请注明来源：内存溢出

JS 事件延迟执行