Event.preventDefault () vs. false zurückgeben

Wenn andere Ereignishandler nach dem Auslösen eines bestimmten Ereignisses ausgeführt werden sollen, kann ich eine von zwei Methoden verwenden. Ich werde in den Beispielen jQuery verwenden, dies gilt jedoch auch für plain-JS:

1. event.preventDefault()

 $('a').click(function (e) { // custom handling here e.preventDefault(); }); 

2. return false

 $('a').click(function () { // custom handling here return false; }); 

Gibt es einen signifikanten Unterschied zwischen diesen beiden Möglichkeiten, um die Verbreitung der Veranstaltung zu stoppen?

Für mich return false; einfacher, kürzer und wahrscheinlich weniger fehleranfällig als das Ausführen einer Methode. Bei dieser Methode sollten Sie den korrekten Fall, die Klammern usw. kennen.

Außerdem muss ich den ersten Parameter im Callback definieren, um die Methode aufrufen zu können. Vielleicht gibt es mehrere Gründe, warum ich dies vermeiden und stattdessen preventDefault verwenden sollte? Was ist der beste Weg?

2661
31 авг. eingestellt von RaYell 31. August 2009-08-31 14:58 09 um 14:58 2009-08-31 14:58
@ 13 Antworten

return false vom jQuery-Ereignishandler ist tatsächlich derselbe wie der Aufruf von e.stopPropagation und e.stopPropagation im übergebenen jQuery.Event- Objekt .

e.preventDefault() verhindert standardmäßig das Auftreten des Ereignisses, e.stopPropagation() verhindert, dass das Ereignis e.stopPropagation() und return false e.stopPropagation() beide. Beachten Sie, dass sich dieses Verhalten von gewöhnlichen (Nicht-jQuery) -Ereignishandlern unterscheidet, bei denen insbesondere return false wird, um ein Ereignis nicht von Blasen zu stoppen.

Quelle: John Resig

Nutzen Sie event.preventDefault () vor "return false", um einen Href-Klick abzubrechen?

2609
31 авг. Die Antwort ist karim79 31 aug. 2009-08-31 15:05 09 um 15:05 2009-08-31 15:05

Meiner Erfahrung nach gibt es mindestens einen klaren Vorteil, wenn die Funktion event.preventDefault () mit return false verwendet wird. Angenommen, Sie erfassen ein Klickereignis für ein Bindungs-Tag. Andernfalls wäre es ein großes Problem, wenn der Benutzer die aktuelle Seite aufrufen müsste. Wenn Ihr Click-Handler return false verwendet, um die Browsernavigation zu verhindern, besteht die Möglichkeit, dass der Interpreter die return-Anweisung nicht erreicht und der Browser das Standardverhalten für Ankertags weiterhin ausführt.

 $('a').click(function (e) { // custom handling here // oops...runtime error...where oh where will the href take me? return false; }); 
border=0

Die Verwendung von event.preventDefault () hat den Vorteil, dass Sie es als erste Zeile im Handler hinzufügen können. Dadurch wird sichergestellt, dass das Standardverhalten nicht standardmäßig funktioniert, unabhängig davon, ob die letzte Zeile der Funktion nicht erreicht wird (z. .).

 $('a').click(function (e) { e.preventDefault(); // custom handling here // oops...runtime error, but at least the user isn't navigated away. }); 
393
23 янв. Antwort von Jeff Poulton 23. Januar 2011-01-23 01:37 11 um 01:37 23.01.2011 01:37

So haben Sie es nicht genannt, die Frage ist "Javascript"; Dies ist eine Frage zum jQuery-Design.

jQuery und ein zuvor in Zusammenhang stehendes Zitat von John Resig ( Post von karim79 ) scheint ein Missverständnis darüber zu sein, wie Event-Handler im Allgemeinen funktionieren.

Fakt: Ein Event-Handler, der false zurückgibt, verhindert die Standardaktion für dieses Ereignis. Dies stoppt die Verbreitung der Veranstaltung nicht. Eventhandler haben schon immer auf diese Weise gearbeitet, beginnend mit den alten Tagen von Netscape Navigator.

Die MDN- Dokumentation erläutert, wie return false im Event-Handler funktioniert.

Was in jQuery passiert, ist nicht dasselbe, was mit Event-Handlern passiert. DOM-Ereignis-Listener und an MSIE angeschlossene Ereignisse sind etwas anderes.

Weitere Informationen finden Sie unter attachEvent in der MSDN- und W3C DOM 2-Ereignisdokumentation .

89
21 июня '10 в 0:31 2010-06-21 00:31 Die Antwort gibt Garrett am 21. Juni '10 um 0:31 2010-06-21 00:31

Normalerweise ist Ihre erste Option ( preventDefault() ) die, die Sie ergreifen müssen, Sie müssen jedoch wissen, in welchem ​​Kontext Sie sich befinden und welche Ziele Sie haben.

Fuel Your Coding hat einen guten Artikel über return false; vs event.preventDefault() vs event.stopPropagation() vs event.stopImmediatePropagation() .

HINWEIS. In dem obigen Link „>Internet-Archiv gefunden , im PDF-Format ausgedruckt und in Dropbox abgelegt: Archivierter Artikel im return false; vs event.preventDefault() vs event.stopPropagation() vs event.stopImmediatePropagation() (PDF)

>
58
09 апр. Die Antwort ist JAAulde 09 April gegeben. 2011-04-09 21:32 '11 um 21:32 2011-04-09 21:32

Wenn Sie jQuery verwenden, führt return false wenn Sie es aufrufen:

  • event.preventDefault();
  • event.stopPropagation();
  • Hören Sie auf, einen Rückruf zu tätigen, und kehren Sie sofort zurück, wenn Sie angerufen werden.

Weitere Informationen und Beispiele finden Sie unter jQuery-Ereignisse: Stop (Mis) mit Return False .

51
19 февр. Antwort von James Drinkard am 19. Februar. 2013-02-19 18:54 '13 am 18:54 2013-02-19 18:54

Sie können viele Funktionen in einem onClick Ereignis für ein einzelnes Element aufhängen. Wie kannst du sicher sein, dass false das letzte sein wird? preventDefault verhindert jedoch definitiv nur das Standardverhalten des Elements.

38
31 авг. Antwort von Eldar Djafarov 31. August 2009-08-31 15:02 09 um 15:02 2009-08-31 15:02

Ich denke,

event.preventDefault()

- w3c ist die angegebene Methode zum Abbrechen von Ereignissen.

Sie können dies in der W3C-Spezifikation für Abbruchereignisse lesen.

Sie können return false nicht in jeder Situation verwenden. Wenn Sie die Javascript-Funktion im Attribut href bereitstellen und false zurückgeben, wird der Benutzer zu einer Seite mit einer falschen Zeichenfolge umgeleitet.

18
31 авг. die antwort ist gegeben rahul 31 aug. 2009-08-31 15:04 09 um 15:04 2009-08-31 15:04

Ich denke, der beste Weg, dies zu tun, ist die Verwendung von event.preventDefault() denn wenn im event.preventDefault() Handler eine event.preventDefault() , wird die zurückgegebene false event.preventDefault() übersprungen und das Verhalten wird dem entgegenstehen, was Sie möchten.

Wenn Sie jedoch sicher sind, dass der Code keine Ausnahmen auslöst, können Sie mit den gewünschten Methoden arbeiten.

Wenn Sie immer noch mit false zurückkehren möchten, können Sie den gesamten Handlercode in einen catch-catch-Block einfügen, wie unten gezeigt:

 $('a').click(function (e) { try{ your code here......... } catch(e){} return false; }); 
13
09 марта '13 в 22:27 2013-03-09 22:27 Die Antwort gibt Naga Srinu Kapusetti am 09. März 13 um 22:27 Uhr 2013-03-09 22:27

Der Unterschied zwischen removeDefault () und false wird wie folgt zurückgegeben:

disableDefault () : Das Standardverhalten des Browsers wird einfach angehalten .

return false : Es werden 3 separate Objekte erstellt, wenn Sie es aufrufen:

  • Es stoppt das Standardverhalten von Browsern.
  • Dies verhindert, dass sich das DOM-Ereignis ausbreitet.
  • Hören Sie auf, einen Rückruf zu tätigen, und kehren Sie sofort zurück, wenn Sie angerufen werden.

Verwendet entsprechend Ihrer Anforderung:

1) Wenn Sie nur das Standardverhalten des Browsers deaktivieren möchten, verwenden Sie die Funktion reflectDefault ().

2) Wenn Sie das Standardverhalten des Browsers verhindern und die Verbreitung des DOM-Ereignisses verhindern möchten, verwenden Sie return false.

0
02 дек. Antwort von GSB 02 Dez. 2017-12-02 22:18 '17 um 22:18 Uhr 2017-12-02 22:18

Im Grunde ist dies so, wie Sie die Dinge kombinieren, denn jQuery ist eine Struktur, die sich hauptsächlich auf HTML-Elemente konzentriert und zumeist die Standardeinstellungen verhindert, während Sie gleichzeitig aufhören, sich auf die Blase auszudehnen.

Daher können wir einfach sagen, dass die Rückgabe von false in jQuery gleich ist:

return false ist e.preventDefault und e.stopPropagation

Vergessen Sie dies jedoch auch nicht in Funktionen, die sich auf jQuery oder DOM beziehen. Wenn Sie es für ein Element ausführen, wird grundsätzlich verhindert, dass alles ausgelöst wird, einschließlich Standardverhalten und Weitergabe von Ereignissen.

Grundsätzlich vor der Verwendung von return false; verstehe zuerst, was e.preventDefault(); und e.stopPropagation(); Wenn Sie glauben, Sie brauchen beide gleichzeitig, verwenden Sie es einfach.

Im Grunde ist dieser Code also unten:

 $('div').click(function () { return false; }); 

gleich diesem Code:

 $('div').click(function (event) { event.preventDefault(); event.stopPropagation(); }); 
0
18 июля '18 в 14:07 2018-07-18 14:07 Die Antwort wird von Alireza am 18. Juli 1818 um 14:07 Uhr 2018-07-18 14:07 gegeben

Der Hauptunterschied zwischen return false und event.preventDefault() besteht darin, dass Ihr Code unter return false nicht ausgeführt wird, und im Falle von event.preventDefault() Ihr Code nach dieser Anweisung ausgeführt.

Wenn Sie return false schreiben, tun Sie im Hintergrund Folgendes.

 * Stops callback execution and returns immediately when called. * event.stopPropagation(); * event.preventDefault(); 
0
09 февр. Antwort von Abdullah Shoaib 09 Feb. 2018-02-09 11:14 '18 am 11:14 2018-02-09 11:14

Meine Meinung sagt aus meiner Erfahrung, dass es immer besser zu benutzen ist

 event.preventDefault() 

Praktisch, um das Senden eines Ereignisses bei Bedarf zu stoppen oder zu unterbinden, anstatt return false event.preventDefault() return false event.preventDefault() funktioniert event.preventDefault() .

0
29 сент. Die Antwort wird Dilip0165 29 sep gegeben . 2014-09-29 14:28 14 am 14:28 2014-09-29 14:28

e.preventDefault ();

Es stoppt einfach die Standardaktion des Elements.

Instanz Bsp .:-

verhindert, dass der Hyperlink der URL folgt, das Senden des Formulars zum Senden ist nicht möglich. Wenn Sie über viele Ereignisbehandlungsroutinen verfügen und Sie das Standardereignis aus diesem Grund einfach verhindern möchten, und aus diesem Grund oft, müssen wir dies am Anfang der Funktion () verwenden.

Grund: -

Grund für die Verwendung von e.preventDefault(); liegt in der Tatsache, dass in unserem Code so etwas nicht im Code klappt, dann können Sie den Link oder das Formular ausführen, um die Ausführung zu senden oder zuzulassen oder alle Aktionen zuzulassen, die Sie ausführen müssen. link oder submit wird gesendet und die Veranstaltung kann trotzdem fortgesetzt werden.

 <!DOCTYPE html> <html > 
0
27 апр. Antwort von Parth Raval 27. April 2018-04-27 09:55 '18 um 9:55 2018-04-27 09:55