本文實例講述了JS實現同一DOM元素上onClick事件與onDblClick事件并存的解決方法。分享給大家供大家參考,具體如下:
最近項目中遇到了在同一DOM元素上需要添加 onclick 和 ondblclick 2個事件,如果按照正常的方式添加處理,結果發現只會執行 onclick,而不會執行 ondblclick;這時我們需要對2個事件的處理函數稍作處理就可以實現2個事件并存了,代碼如下:
<script type="text/javascript"> var clickTimer = null; function _click(){   if(clickTimer) {     window.clearTimeout(clickTimer);     clickTimer = null;   }   clickTimer = window.setTimeout(function(){      // your click process code here      alert("你單擊了我");   }, 300); }  function _dblclick(){   if(clickTimer) {     window.clearTimeout(clickTimer);     clickTimer = null;   }   // your click process code here   alert("你雙擊了我"); }</script><button onclick="_click();" ondblclick="_dblclick();">單擊或雙擊我</button>處理思想就是:利用定時器延遲執行onclick事件,這樣在雙擊過程中會取消中途觸發的單擊事件。
新聞熱點
疑難解答