In der JavaScript-Ereignisbehandlung, warum "return false" oder "event.preventDefault ()" und "stopping the event flow" werden einen Unterschied machen?

9

Es wird gesagt, dass wenn wir ein "click-Ereignis" behandeln, die Rückgabe false oder das Aufrufen von event.preventDefault () einen Unterschied macht, in welchem ​​

  

Der Unterschied ist preventDefault   wird nur das Standardereignis verhindern   Aktion, die auftritt, d.h. eine Seitenweiterleitung   auf einen Link klicken, ein Formular einreichen,   usw. und return false wird auch aufhören   der Ereignisfluss.

Bedeutet das, wenn das click-Ereignis mehrmals für mehrere Aktionen registriert wird,

%Vor%

Wird false zurückgegeben, werden die anderen Handler nicht mehr ausgeführt?

Ich bin jetzt auf einem Mac und kann daher nur Firefox und Chrome verwenden, aber nicht IE, der ein anderes Event-Modell hat und es auf FF und Chrome getestet hat, indem ich 3 Handler hinzugefügt habe, und alle 3 Handler laufen ohne anzuhalten .... Worin liegt der wirkliche Unterschied oder gibt es eine Situation, in der das "Stoppen des Ereignisflusses" nicht wünschenswert ist?

Dies steht im Zusammenhang mit

jQuerys animate () verwenden Wenn das angeklickte Element "& lt; a href=" # "... & gt; & lt; / a & gt;" lautet, sollte die Funktion dennoch false zurückgeben?

und

Was ist der Unterschied zwischen e.preventDefault (); und false zurückgeben?

    
太極者無極而生 15.06.2010, 02:10
quelle

5 Antworten

13

hofft, dass dieser Code es Ihnen erklären kann ...

html

%Vor%

jquery

%Vor%

Demo

oder

%Vor%

demo 2

    
Reigel 15.06.2010, 02:18
quelle
9

Das Schreiben von return false oder e.preventDefault() verhindert nicht die Ausführung anderer Handler.

Sie verhindern vielmehr die Standardreaktion des Browsers, z. B. die Navigation zu einem Link.

In jQuery können Sie e.stopImmediatePropagation() schreiben, um zu verhindern, dass andere Handler ausgeführt werden.

    
SLaks 15.06.2010 02:17
quelle
2

return false und preventDefault() dienen dazu, die Standardaktion des Browsers zu verhindern, die einem Ereignis zugeordnet ist (z. B. nach dem Klicken auf einen Link). Es gibt eine andere Technik, um dies für jedes der drei verschiedenen Szenarien zu erreichen:

1. Ein Ereignishandler, der mit addEventListener() (Nicht-IE-Browser) hinzugefügt wurde . In diesem Fall verwenden Sie die Methode preventDefault() des Objekts Event . Andere Handler für das Ereignis werden weiterhin aufgerufen.

%Vor%

2. Ein Ereignishandler, der mit attachEvent() (IE) hinzugefügt wurde. Setzen Sie in diesem Fall die Eigenschaft returnValue von window.event auf true . Andere Handler für das Ereignis werden weiterhin aufgerufen und können diese Eigenschaft auch ändern.

%Vor%

3. Ein Ereignishandler, der mithilfe einer Attribut- oder Ereignishandlereigenschaft hinzugefügt wurde .

%Vor%

oder

%Vor%

In diesem Fall übernimmt return false die Aufgabe. Alle anderen Ereignishandler, die über addEventListener() oder attachEvent() hinzugefügt wurden, werden weiterhin aufgerufen.

%Vor%     
Tim Down 15.06.2010 08:35
quelle
1

Manchmal möchte ein Ereignis-Listener die Nebeneffekte des Ereignisses löschen, an dem es interessiert ist. Stellen Sie sich ein Textfeld vor, in dem Sie nur Zahlen zulassen möchten. Da Textfelder alles akzeptieren können, muss der Browser angewiesen werden, nicht getippte Zahlen zu ignorieren. Dies wird durch Abhören der Schlüsselereignisse und Zurückgeben von false erreicht, wenn der falsche Schlüssel eingegeben wird.

    
mP. 15.06.2010 02:35
quelle
0

Dies beantwortet deine Frage nicht vollständig, aber neulich habe ich YUIs e.preventDefault() auf einem <a> -Element benutzt, um die href -Aktion zu quetschen, da ich nur das JavaScript onclick -Ereignis steuern wollte ( es sei denn, dass kein JS entdeckt wurde). In dieser Situation würde mich die gesamte Kette von Ereignissen nicht beeinflussen.

Aber ein paar Tage davor hatte ich ein <input type="checkbox"> in einem Element <label> verschachtelt und ich musste im Ereignishandler eine Bedingung verwenden, um festzustellen, ob das angeklickte Ziel ein Label war, weder e.preventDefault() noch e.stopEvent() hat mein 'click'-Ereignis von ( legitim gestoppt) >) zweimal triggern (außer in IE6).

Was schön gewesen wäre, wäre die Fähigkeit, eine ganze Kette zusammenhängender Ereignisse zu zerquetschen, da ich bereits Propagation und return false ; probiert habe, aber dank meines Label-Elements habe ich immer ein zweites Eventfeuer bekommen / p>

Edit: Ich hätte nichts dagegen, wenn ich wüsste, wie Jquery mit meiner Doppelereignissituation umgegangen wäre, wenn jemand dazu bereit wäre, das zu kommentieren.

    
danjah 15.06.2010 02:25
quelle