首頁 > web前端 > js教程 > js jq 點擊和雙擊區分範例介紹_基礎知識

js jq 點擊和雙擊區分範例介紹_基礎知識

WBOY
發布: 2016-05-16 17:17:35
原創
1180 人瀏覽過
一:原理:

先看一下點擊事件的執行順序:

點選(click):mousedown,mouseout,click;
雙擊(dblclick) :mousedown,mouseout,click , mousedown,mouseout,click,dblclick;

在雙擊事件(dblclick),觸發的兩次點擊事件(click)中,第一次的點擊事件(click)會被屏蔽掉,但第二次不會。也就是說雙擊事件(dblclick)會回傳一次點選事件(click)結果和一次雙擊事件(dblclick) 結果。而不是一次雙擊事件(dblclick)結果和兩次點擊事件結果(click)。

如此這般的話,只需消滅掉多餘的一次點擊事件(click),這個問題就解決了。

setTimeout

二:程式碼:
複製程式碼



複製程式碼



複製程式碼



複製程式碼



複製程式碼


複製碼如下: //定義setTimeout執行方法var TimeFn = null; $('div').click(function () { // 取消上次延時未執行的方法clearTimeout(TimeFn); //執行延時TimeFn = setTimeout(function(){ //do function在此寫入事件要執行的程式碼},300); }); $('div').dblclick(functin () { // 取消上次延遲未執行的方法clearTimeout(TimeFn); //雙擊事件的執行程式碼})
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板