Ⅰ 求JS 大神指导,页面的防止重复点击事件(具体见补充)
可以添加标记,第一次点击后变为false,每次点击判断这个标记是true才执行。
如果是按钮防止重复点击,可以再按钮点击后,给按钮添加disabled属性。
Ⅱ html、js轮播图怎么阻止快速、多次点击造成的混乱
古老的做法是用settimeout或者setinterval实现循环动画,但是这样就会造成题主说的,在且页面的时候会造成混乱。
因为当页面失去焦点时浏览器不再渲染页面,但是settimeout/setinterval的请求不会停止,队列会一直堆积动画,当页面再次获得焦点时动画队列早已堆积了大量命令,就会导致动画混乱。
现在的做法,笼统地说,是使用requestanimationframe函数,用法和settimeout/setinterval类似,只不过requestanimationframe不接受时间参数,函数的执行频率由浏览器的渲染帧数决定,这就实现了由浏览器决定动画队列,避免了动画混乱。当然也可以使用一些现成的轮播图插件,题主可以自己网络,这里对比举例说明一下settimeout和requestanimationframe的用法。
//用setTimeout实现在控制台循环输出helloworld
functionfun(){
console.log('helloworld');
setTimeout(function(){
fun();
},3000);
}
fun();//执行fun函数,就可以每隔3000毫秒递归的输出helloworld
//用reqestanimationframe实现在控制台循环输出helloworld
functionfun(){
console.log('helloworld');
requestAnimationFrame(function(){
fun();
})
}
fun()//执行fun函数,就可以每隔3000毫秒递归的输出helloworld
//requestAnimationFrame没有时间参数,所以直接使用不能控制间隔
//但我们可以人为的限制执行间隔,方法如下
functionfun(last_time){
if(newDate().getTime()-last_time>3000){
console.log('helloworld');
requestAnimationFrame(function(){
fun(newDate().getTime());
})
}else{
requestAnimationFrame(function(){
fun(last_time)
});
}
}
fun(newDate().getTime())
//这样就可以为requestAnimationFrame设置间隔,实现每隔3000毫秒输出helloworld
//抱歉我主写c副写python偶尔写javaweb,分号用的有些乱。