var timer = null;function do_click(event) { clearTimeout(timer); // 这里加一句是为了兼容 Gecko 的浏览器 / if (event.detail == 2) return ; // 同上句的作用 timer = setTimeout(function() { // click 事件的处理 }, 300); }function do_dblclick(event) { clearTimeout(timer); // dblclick 事件的处理}
问题总结 从测试结果来看,如果前后两次点击的时间在 300ms 左右的时候,还是很容易出现 click 和 dblclick 事件被“同时”调用的情况,而如果间隔的时间更短或更长,则只会有 click 或 dblclick 事件。 所以,应该说这个方法已经在很大程度上,避免了 click 和 dblclick 事件的“同时”存在问题。当然,它还没有达到完全解决的程度。 注意 windows 的控制面板里是可以调鼠标的双击速度的(Linux 等系统下能不能调,俺就不清楚了),这点对于程序还是有一定影响,大家可以自己调节下试试看~ 经过测试,延时 300ms 是一个比较理想的事件,既考虑到对鼠标操作并不十分顺利的朋友,也兼顾 click 事件的响应速度 以上代码,只在 IE6、IE7、IE8、FF3、Chrome 中测试过,并未出现问题
w3c标准是没有dblclick的,而是通过event.detail来判断是单击或双击
Cyper实战:var timer = null;$(".todo").bind("dblclick", function (e) { clearTimeout(timer); if (confirm("mark as complete?")) { var $this = $(this); var rowId = $this.data('id'); $.ajax({ url: 'todo_action.php?action=del&id=' + rowId, success: function () { $this.remove(); }, error: function () { console.log('error'); } }); }});$(".todo").bind("click", function (e) { // fix Gecko browser issue clearTimeout(timer); //if it's double click if(e.detail == 2) { return; } //if it's click var that = this; timer = setTimeout(function(){ modifyTodo(that); }, 300)});