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

黄舟
Lepaskan: 2017-06-27 10:36:46
asal
1448 orang telah melayarinya

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

  • $("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);
                    });
Salin selepas log masuk

Atas ialah kandungan terperinci jQuery中同时添加click和dblclick事件的实例介绍. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan