jQuery verhindert das Doppelklicken bei mehreren Übermittlungen und die Übergabe dynamischer Funktionen oder mehrerer Parameter

jQuery verhindert das Doppelklicken bei mehreren Übermittlungen und die Übergabe dynamischer Funktionen oder mehrerer Parameter_jquery

WBOY

Freigeben： 2016-05-16 16:53:41

Original

1090 Leute haben es durchsucht

Heute schreibe ich über das Problem, dass das Doppelklick-Ereignis von JQ mehrere Übermittlungen verhindert. Es kann in Stapeln über Funktionen definiert werden, was es vielseitiger macht und die Ereignisse von Elementen über Methoden dynamisch bindet. Und Sie können Funktionsnamen oder mehrere Parameter dynamisch übergeben (in diesem Beispiel wird nur der Funktionsname übergeben und über Eval aufgerufen).

Wir alle wissen, dass in der Ereignisbindung von jQuery zwei Klickereignisse (click) ausgelöst werden können, wenn ein Doppelklickereignis (dblclick) ausgeführt wird. Das heißt, ein Label-Element (z. B. div usw.): Wenn das Element sowohl an ein Klickereignis (click) als auch an ein Doppelklickereignis (dblclick) gebunden ist, wird das Klickereignis (click) ausgeführt, wenn das Element ausgeführt wird Das Doppelklick-Ereignis (dblclick) wird nicht ausgelöst, und das Doppelklick-Ereignis (dblclick) löst zwei Klick-Ereignisse (click) aus.

Erster Blick auf die Ausführungssequenz von Klickereignissen:

Klick (Klick): Mousedown, Mouseout, Klick;
Doppelklick (Dblclick): Mousedown, Mouseout, Klick, Mousedown , mouseout , click, dblclick;

Im Doppelklickereignis (dblclick) wird von den beiden ausgelösten Klickereignissen (click) das erste Klickereignis (click) blockiert, das zweite jedoch nicht treffen. 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).

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

Der Effekt ist wie folgt:
http://images.cnitblog.com/i/554071/201404/010846579687197.png
Der Quellcode ist wie folgt:

Code kopieren Der Code lautet wie folgt:

Testergebnisse anzeigen:

Klicken Sie auf mich

function std (obj,vs){
var TimeFn = null;
var funs=$(obj).attr("onclick");
$(obj ).click(function() {
clearTimeout(TimeFn);
TimeFn = setTimeout(function(){
eval(funs);
clearTimeout(TimeFn);
}, 400) ;
});

$(obj).dblclick(function() {
clearTimeout(TimeFn);
$(obj).removeAttr("onclick ");
}

var ss1=function(s){$("#show").html("DIV zeigt Testergebnisse an:" s);alert("a");}; //Von div aufgerufene Methode
var ss2=function(s){$("#show").html("INPUT zeigt Testergebnisse an:" s);alert("b");};//Methode aufgerufen by input

//Dynamische Bindung von Elementereignissen durch Methoden
std("#div","div");