为什么setinterval和settimeout越点击越快以及响应的解决办法
setinterval大家都很了解,但是如果时间长的话,误差也会越来越大,所以我习惯上使用settimeout的递归,闲来没事,写了一个定时器的递归
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div> </div>
<button>点击</button>
</body>
<script>
$(function () {
var num = 0;
var end = "";
$("button").on("click", function () {
function result() {
end = setTimeout(function() {
num++;
$("div").text(num);
result()
}, 1000);
}
result();
})
})
</script>
</html>
嗯,,看似很完美,有一个很明显的bug,那就是在页面上,越点击,,它跑的越快,并没有依照1000毫秒的时间进行间隔执行,这是因为,,每点击一次,,settimeout就注册一次,所以会越来越快,,解决的思路就是每次点击的时候进行定时器的清除,,代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div> </div>
<button>点击</button>
</body>
<script>
$(function () {
var num = 0;
var end = "";
$("button").on("click", function () {
clearTimeout(end);
function result() {
end = setTimeout(function() {
num++;
$("div").text(num);
result()
}, 1000);
}
result();
})
})
</script>
</html>
嗯,,完美
为什么setinterval和settimeout越点击越快以及响应的解决办法的更多相关文章
- (转载)js(jquery)的on绑定点击事件执行两次的解决办法
js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...
- IOS的Safari浏览器中,点击事件失效的原理及解决办法
这里做了事件委托,简单区分一下[目标元素]和[代理元素],为后续论述理解做铺垫. [目标元素]:实际希望点击的元素,可以是任意标签. [代理元素]:代替[目标元素]触发点击事件的元素,有可能是目标元素 ...
- swfupload在chrome中点击上传图片按钮无反应的解决办法
chrome 22.0.XXXXX dev版上传图片按钮点击无反应原因:是GOOGLE的内建Flash PPAPI外挂所导致的. 问题原因: 由于Google浏览器(Chrome),在最新测试版22. ...
- [Discuz!] Discuz X1.5点击“发帖”出现XML代码的解决办法!
使用的是Discuz X1.5程序,不知什么原因,今天突然出现了大问题,就是在点击“发帖”的时候,原来正常显示的网页竟然变成了XML代码!经过一番查找资料,也未能找到是什么原因导致的,只是找到了解决办 ...
- button快速点击造成多次相应的解决办法
UIButton+touch.h #import <UIKit/UIKit.h> #define defaultInterval 3 //默认时间间隔 @interface UIButto ...
- popupWindow使用timePicker时点击出现闪屏问题的解决办法
记录一下刚解决的新鲜bug,噔噔噔噔: 首先说明,我并不知道到底是什么原理导致和解决的问题 总之就是,我在使用popupWindow时的弹出方法使用的是popupWindow.showAsDropDo ...
- jQuery on()方法绑定动态元素的点击事件无响应的解决办法
$('#check_all').on('click' , function(){ alert(1); }); $("#yujinlist").append(html); count ...
- “Bootstrap做的响应式菜单在iPhone上点击不了二级菜单“的解决办法!
只需把把点击的a(被点击的)变成button即可.
- 移动端点击返回时强制页面刷新解决办法(pageshow)
在做移动端项目的时候经常遇到这样一个功能比如: 返回后页面不刷新,一些失效的信息依然显示在页面上.这个问题在iphone手机上会出现,在Android手机上返回时会自动刷新(由于手机机器种类不多,无法 ...
随机推荐
- C++笔记 4
1.类和对象 类就是对对象的描述,主要从属性和行为两个方面描述. 对于属性一般作成private , 行为作为public 函数 (1)构造函数,初始化所有的成员变量,系统自动调用,可以重 ...
- 【Unity/Kinect】Kinect一些常用的API
先开好这个坑,之后用到就补充,方便回顾. 获取用户相对Kinect传感器设备的位置坐标.(在Kinect坐标系中的位置) public Vector3 GetUserPosition(Int64 us ...
- 【Unity/SVN】使用SVN管理Unity项目
本文转载自:http://blog.csdn.net/neil3d/article/details/38437237 Unity提供了自己的XXXServer,不过大家评论好像不是很好用,主要是不支持 ...
- u-boot bootz 加载kernel 流程分析
u-boot 加载 kernel 的流程分析. image重要结构体头文件 // include/image.h * * Legacy and FIT format headers used by d ...
- uboot全局数据gd_t、bd_t和device_t
gd_t定义在include/asm-arm/global_data.h 33 /* Keep it *SMALL* and remember to set CFG_GBL_DATA_SIZE &g ...
- FastDFS - 文件服务器学习资料
FastDFS搭建及java整合代码 CentOS 6.5下 FastDFS结合Nginx插件实现图片http访问 图片服务器fastDFS的搭建以及配置 nginx fastdfs 配置后 上传成功 ...
- java-jsp与servlet
Java Servlet 是运行在带有支持 Java Servlet 规范的解释器的 web 服务器上的 Java 类. 每次服务器接收到一个 Servlet 请求时,服务器会产生一个新的线程并调用服 ...
- d3js技术文档
D3js技术文档 概述 D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply ...
- js学习笔记16----父节点的操作
1.元素.parentNode : 只读属性,获取当前元素的父节点. 2.元素.offsetParent : 只读属性,获取离当前元素最近的一个有定位属性(position为relative或者abs ...
- R语言中字符串的拼接操作
在R语言中 paste 是一个很有用的字符串处理函数,可以连接不同类型的变量及常量. 函数paste的一般使用格式为: paste(..., sep = " ", collapse ...