一:原理:
先看一下点击事件的执行顺序:
单击(click):mousedown,mouseout,click;
双击(dblclick):mousedown,mouseout,click , mousedown,mouseout,click,dblclick;
在双击事件(dblclick),触发的两次单击事件(click)中,第一次的单击事件(click)会被屏蔽掉,但第二次不会。也就是说双击事件(dblclick)会返回一次单击事件(click)结果和一次双击事件(dblclick) 结果。而不是一次双击事件(dblclick)结果和两次单击事件结果(click)。
如此这般的话,只需消灭掉多余的一次单击事件(click),这个问题就解决了。
setTimeout
二:代码:
//定义setTimeout执行方法
var TimeFn = null;
$('div').click(function () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//执行延时
TimeFn = setTimeout(function(){
//do function在此处写单击事件要执行的代码
},300);
});
$('div').dblclick(functin () {
// 取消上次延时未执行的方法
clearTimeout(TimeFn);
//双击事件的执行代码
})
分享到:
相关推荐
一:原理: 先看一下点击事件的执行...也就是说双击事件(dblclick)会返回一次单击事件(click)结果和一次双击事件(dblclick) 结果。而不是一次双击事件(dblclick)结果和两次单击事件结果(click)。 如此这般的话,只需消
可以实现js的左键单击,双击,拖拽,右键单击,双击,拖拽,和中键的单击,双击和拖拽事件,以及滚轮事件,已经封装成jquery插件,调用方便,功能强大。
分享一个 jq拖拽(支持双击事件和拖拽)
js 和jq 思维导图,复习使用,简单,自己敲的 xmind。。。
该插件的节点默认绑定的单击事件,由此引起了单击事件和双击事件的冲突。 编写测试代码 引起冲突的代码: 问题效果展示: 每一次触发双击事件都会引起两次单击事件 解决冲突的代码: 解决问题效果展示: 完美...
js css jq api文档
JQ JS javascript 截图功能 画图功能
css,js,jq代码段css,js,jq代码段css,js,jq代码段css,js,jq代码段
JQ JS javascript 多选 多选下拉框 select bootstrap-select
dom_freemark_jq1.4js.rardom_freemark_jq1.4js.rardom_freemark_jq1.4js.rardom_freemark_jq1.4js.rar
html+css+js+jq的一些学习小demohtml+css+js+jq的一些学习小demo html+css+js+jq的一些学习小demohtml+css+js+jq的一些学习小demo html+css+js+jq的一些学习小demohtml+css+js+jq的一些学习小demo html+css+js+jq的...
JQ JS javascript bootstrap 带搜索 下拉框 select
jq&js;参考手册其中包含:JavaScript核心参考手册,jQuery 1.3至1.83的参考手册
JQ JS javascript 日期多选控件 JQ JS javascript 日期多选控件
-万年历
近几年来,互联网+、大数据、云计算、物联网、虚拟现实、人工智能、机器学习等新概念层出不穷,相关行业发展迅猛。
JQ JS javascript new Data() 获取 指定日期 的 后一天
支持动态生成树,区分叶子节点和根节点的点击方式,纯JS+JQ编写,代码易懂,支持修改。