Teilen Sie die Lösung für den Konflikt zwischen dem JQuery-Ereignis dblclick und click-js-Tutorial-php.cn

Teilen Sie die Lösung für den Konflikt zwischen dem JQuery-Ereignis dblclick und click

黄舟

Freigeben： 2017-06-27 10:42:00

Original

2001 Leute haben es durchsucht

In jquery sind click und dblclick beide Klick-events, aber in dblclick handelt es sich bei event um einen wiederholten Klick auf das Click-Ereignis. Wenn wir es also gleichzeitig tun, wird es so sein Konflikt wie folgt Schauen wir uns die Analyse an.

Im Doppelklickereignis (dblclick) wird von den beiden ausgelösten Klickereignissen (Klick) das erste Klickereignis (Klick) blockiert, das zweite jedoch nicht.

<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    $("p").slideToggle();
  });
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button>切换</button>
</body>

Nach dem Login kopieren

Das heißt, ein Doppelklick-Ereignis (dblclick) gibt ein Klick-Ereignis-Ergebnis (click) und ein Doppelklick-Ereignis-Ergebnis (dblclick) zurück. Anstelle des Ergebnisses eines Doppelklickereignisses (dblclick) und des Ergebnisses zweier Klickereignisse (click).

dblclick() Wenn auf ein Element doppelgeklickt wird, tritt das dblclick-Ereignis auf. Ein Klick erfolgt, wenn sich der Mauszeiger über einem Element befindet und die linke Maustaste gedrückt und wieder losgelassen wird. Treten innerhalb kurzer Zeit zwei Klicks auf, handelt es sich um ein Doppelklick-Ereignis.

<script type="text/javascript">
$(document).ready(function(){
  $("button").dblclick(function(){
    $("p").slideToggle();
  });
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button>请双击此处</button>
</body>

Nach dem Login kopieren

Beseitigen Sie in diesem Fall einfach das zusätzliche Klickereignis (Klick) und das Problem wird gelöst.

var timer = null; 
$(&#39;button&#39;).live(&#39;click&#39;, function(event){ 
    timer && clearTimeout(timer); 
    timer = setTimeout(function(){ 
        console.log(event.type); 
    },300); 
}).live(&#39;dblclick&#39;, function(event){ 
    timer && clearTimeout(timer); 
    console.log(event.type); 
});

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonTeilen Sie die Lösung für den Konflikt zwischen dem JQuery-Ereignis dblclick und click. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!