jQuery中同时添加click和dblclick事件的实例介绍

来源：动视网责编：小采时间：2020-11-27 20:18:23

jQuery中同时添加click和dblclick事件的实例介绍

jQuery中同时添加click和dblclick事件的实例介绍:添加事件的代码比较简单，有两种方法：$("abc").bind({"click":fn,"dblclick":fn});$("abc").click(fn).dblclick(fn)目前的问题是无论双击或者单击都只执行单击的function，为什么呢？下面我们

推荐度：

点击下载本文 文档为doc格式

导读jQuery中同时添加click和dblclick事件的实例介绍:添加事件的代码比较简单，有两种方法：$("abc").bind({"click":fn,"dblclick":fn});$("abc").click(fn).dblclick(fn)目前的问题是无论双击或者单击都只执行单击的function，为什么呢？下面我们

添加事件的代码比较简单，有两种方法：

$("abc").bind({"click":fn,"dblclick":fn});

$("abc").click(fn).dblclick(fn)

目前的问题是无论双击或者单击都只执行单击的function，为什么呢？
下面我们说一下双击的机制：

双击(dblclick)的流程是：mousedown，mouseout，click，mousedown，mouseout，click，dblclick；

要想实现双击我们必须屏蔽这两次click，因此我们在click里面设置一个定时器，延迟执行function。
完整代码如下：

//绑定点击和双击事件
 var _time = null;
 $(this).find("tr").dblclick(function(e){
 clearTimeout(_time);
 console.log("dblclick");
 //真正双击代码

 }).click(function(e){
 clearTimeout(_time);
 _time = setTimeout(function(){
 console.log("click");
 //单击事件在这里

 }, 300);
 });

jQuery中同时添加click和dblclick事件的实例介绍

推荐度：

点击下载本文 文档为doc格式

标签：事件示例实例

热门焦点

jQuery中同时添加click和dblclick事件的实例介绍

jQuery中同时添加click和dblclick事件的实例介绍

jQuery中同时添加click和dblclick事件的实例介绍

最新推荐

猜你喜欢

热门推荐