JS实现鼠标单击与双击事件共存_javascript技巧
来源：动视网
责编：小采
时间：2020-11-27 21:20:42
JS实现鼠标单击与双击事件共存_javascript技巧
JS实现鼠标单击与双击事件共存_javascript技巧:一直都认为在Web开发中，双击事件都是少至又少地使用，直到最近项目需要，要在一个按钮上绑定单击与双击两件事件。开始也觉得不就是给按钮绑下两个事件而已罢了……只是后来才明白，是我想得太简单，在双击事件触发的同时也会触发单击的~囧 通过一番研究后，
导读JS实现鼠标单击与双击事件共存_javascript技巧:一直都认为在Web开发中，双击事件都是少至又少地使用，直到最近项目需要，要在一个按钮上绑定单击与双击两件事件。开始也觉得不就是给按钮绑下两个事件而已罢了……只是后来才明白，是我想得太简单，在双击事件触发的同时也会触发单击的~囧 通过一番研究后，
一直都认为在Web开发中，双击事件都是少至又少地使用，直到最近项目需要，要在一个按钮上绑定单击与双击两件事件。开始也觉得不就是给按钮绑下两个事件而已罢了……只是后来才明白，是我想得太简单，在双击事件触发的同时也会触发单击的~囧
通过一番研究后，终于利用JS中“setTimeout”延时执行方法的办法，将单击延迟300毫秒执行才解决了，代码如下：
代码如下:
$(function () {
var num = 0;
var timeFunName = null;
$("button").bind("click", function () {
// 取消上次延时未执行的方法
clearTimeout(timeFunName);
// 延时300毫秒执行单击
timeFunName = setTimeout(function () {
num++;
$("textarea").val($("textarea").val() + "第" + num + "次事件，事件名：单击/n");
}, 300); }).bind("dblclick", function () {
// 取消上次延时未执行的方法
clearTimeout(timeFunName);
num++;
$("textarea").val($("textarea").val() + "第" + num + "次事件，事件名：双击/n");
});
});
// -->
JS实现鼠标单击与双击事件共存_javascript技巧
JS实现鼠标单击与双击事件共存_javascript技巧:一直都认为在Web开发中，双击事件都是少至又少地使用，直到最近项目需要，要在一个按钮上绑定单击与双击两件事件。开始也觉得不就是给按钮绑下两个事件而已罢了……只是后来才明白，是我想得太简单，在双击事件触发的同时也会触发单击的~囧 通过一番研究后，
