一:原理:
先看一下点击事件的执行顺序:
单击(click):mousedown,mouseout,click;
双击(dblclick):mousedown,mouseout,click , mousedown,mouseout,click,dblclick;
在双击事件(dblclick),触发的两次单击事件(click)中,第一次的单击事件(click)会被屏蔽掉,但第二次不会。也就是说双击事件(dblclick)会返回一次单击事件(click)结果和一次双击事件(dblclick) 结果。而不是一次双击事件(dblclick)结果和两次单击事件结果(click)。
如此这般的话,只需消灭掉多余的一次单击事件(click),这个问题就解决了。
setTimeout
二:代码:
Jquery实现:
//定义setTimeout执行方法 var TimeFn = null; $('div').click(function () { // 取消上次延时未执行的方法 clearTimeout(TimeFn); //执行延时 TimeFn = setTimeout(function(){ //do function在此处写单击事件要执行的代码 },300); }); $('div').dblclick(functin () { // 取消上次延时未执行的方法 clearTimeout(TimeFn); //双击事件的执行代码 })
Js实现:
<input type="button" onclick="aa()" ondblclick="bb()" value="点我"> <script language="javascript"> var isdb; function aa(){ isdb=false; window.setTimeout(cc, 500) function cc(){ if(isdb!=false)return; alert("单击") } } function bb(){ isdb=true; alert("双击") } </script>
相关推荐
即一个标签元素(如div等),如果元素同时绑定了单击事件(click)和双击事件(dblclick),那么执行单击事件(click)时,不会触发双击事件(dblclick), 执行双击事件(dblclick)时却会触发两次单击事件(click)。
可以实现js的左键单击,双击,拖拽,右键单击,双击,拖拽,和中键的单击,双击和拖拽事件,以及滚轮事件,已经封装成jquery插件,调用方便,功能强大。
JavaScript - jQuery实现短信验证码注册登录完整示例:JavaScript - jQuery和附件说明
js与jQuery实现获取table中的数据并拼成json字符串操作示例.docx
jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)jquery-3.7.0.min.js(jQuery下载)...
jquery 实现鼠标单击行时,改变行的背景颜色,选中checkbox复选框
原生JS加jQuery实现拖拽和单击上传文件; 知勤者笔记(https://www.zhiqinzhe.com)可以免费获取本人在CSDN和其他平台上传的资源(或下载地址);
jQuery 单图单击预览示例
jQuery-doubleTap是一款非常有用的鼠标双击事件或移动设备的触摸双击事件检测jQuery插件。该插件通过对“click”和“touch”的简单代码优化来实现鼠标双击或触摸双击事件的检测
使用html+css+js+jquery实现小米官网首页
里面收集了学js和jquery以来的很多例子,是参考的选择。
通过将编程理论与用来演示JavaScript和jQuery如何被应用于流行站点之上的示例相结合,《JavaScript&jQuery;交互式Web前端开发》将教会您如何让网站更具交互性、吸引性、可用性。很快,您就能够像一名程序员那样去...
一款国外网站翻译过来的图片放大效果,国内至今还未见过此效果。双击图片,图片独立显示,其他内容变暗,点击放大镜,图片放大,效果不错
主要介绍了jQuery实现动态给table赋值的方法,结合具体实例形式分析了jQuery动态操作table表格节点的相关技巧,需要的朋友可以参考下
JavaScript+jQuery网页特效设计实例源码
在echarts点击事件基础上添加单击和双击事件,使单双击事件并存。该资源为用html和jquery实现的简单的单双击事件并存的demo。
jquery barcode js 包+示例
简单的jquery.netstable.js 示例
该插件的节点默认绑定的单击事件,由此引起了单击事件和双击事件的冲突。 编写测试代码 引起冲突的代码: 问题效果展示: 每一次触发双击事件都会引起两次单击事件 解决冲突的代码: 解决问题效果展示: 完美...
Jquery实现省市区/县三级联动的Javascript脚本