event.preventDefault () vs. return false

Aus meiner Erfahrung gibt es bei der Verwendung von event.preventDefault () mindestens einen klaren Vorteil gegenüber der Verwendung von return false. Angenommen, Sie erfassen das Klickereignis mit einem Ankertag. Andernfalls wäre dies ein großes Problem, wenn der Benutzer von der aktuellen Seite weg navigiert würde. 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 des Ankertags ausführt.

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

  // oops...runtime error...where oh where will the href take me?

  return false;
});

Die Verwendung von event.preventDefault () hat den Vorteil, dass Sie dies als erste Zeile im Handler hinzufügen können, um sicherzustellen, dass das Standardverhalten des Ankers nicht ausgelöst wird, unabhängig davon, ob die letzte Zeile der Funktion nicht erreicht wird (z. B. Laufzeitfehler ).

$('a').click(function (e) {
  e.preventDefault();

  // custom handling here

  // oops...runtime error, but at least the user isn't navigated away.
});

Dies ist keine "JavaScript" -Frage; Es ist eine Frage zum Design von jQuery.

jQuery und das zuvor verknüpfte Zitat aus John Resig (in karim79smessage ) scheinen das Missverständnis der Quelle zu sein, wie Eventhandler im Allgemeinen funktionieren. 

Fakt: Ein Event-Handler, der false zurückgibt, verhindert die Standardaktion für dieses Ereignis. Die Ereignisausbreitung wird nicht angehalten. Eventhandler haben seit den alten Tagen von Netscape Navigator immer so gearbeitet.

Die Dokumentation von MDN erläutert die Funktionsweise von return false in einem Event-Handler

Was in jQuery passiert, ist nicht dasselbe wie bei Event-Handlern. DOM-Ereignis-Listener und "angefügte" MSIE-Ereignisse sind eine ganz andere Sache. 

Weitere Informationen finden Sie unter attachEvent in MSDN und in der Dokumentation zu W3C DOM 2 Events .

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

Fuel Ihre Codierung enthält einen großen Artikel zu return false; vs event.preventDefault() vs event.stopPropagation() vs event.stopImmediatePropagation() .

Bei Verwendung von jQuery führt return false beim Aufrufen drei verschiedene Aktionen aus:

1. event.preventDefault();
2. event.stopPropagation();
3. Stoppt die Ausführung des Rückrufs und kehrt sofort zurück, wenn er aufgerufen wird.

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

Sie können für ein Element eine Vielzahl von Funktionen an das Ereignis onClick hängen. Wie können Sie sicher sein, dass der false der letzte ist, der abgefeuert wird? preventDefault hingegen verhindert definitiv nur das Standardverhalten des Elements.

Meiner Ansicht nach

event.preventDefault()

ist die vom W3C festgelegte Methode zum Abbrechen von Ereignissen.

Sie können dies in der W3C-Spezifikation zu Event cancelation nachlesen.

Außerdem können Sie return false nicht in jeder Situation verwenden. Wenn Sie im Attribut href eine JavaScript-Funktion angeben und false zurückgeben, wird der Benutzer zu einer Seite mit einer falschen Zeichenfolge weitergeleitet.

Ich denke, der beste Weg, dies zu tun, ist die Verwendung von event.preventDefault(), denn wenn im Handler eine Ausnahme ausgelöst wird, wird die return false-Anweisung übersprungen und das Verhalten wird dem entsprechen, was Sie möchten.

Wenn Sie jedoch sicher sind, dass der Code keine Ausnahmen auslöst, können Sie sich für eine beliebige Methode entscheiden.

Wenn Sie dennoch mit der Rückgabe false fortfahren möchten, können Sie Ihren gesamten Handler-Code in einen try-catch-Block wie folgt einfügen:

$('a').click(function (e) {
  try{
      your code here.........
  }
   catch(e){}
  return false;
});

Meine Meinung aus meiner Erfahrung besagt, dass es immer besser zu verwenden ist 

event.preventDefault() 

Praktisch das Senden eines Ereignisses zu stoppen oder zu verhindern, wann immer wir es brauchen, statt return falseevent.preventDefault() funktioniert gut.

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

Wenn Sie return false schreiben, erledigen Sie hinter den Kulissen folgende Dinge für Sie.

* Stops callback execution and returns immediately when called.
* event.stopPropagation();
* event.preventDefault();

e.preventDefault ();

Die Standardaktion eines Elements wird einfach angehalten.

Instanz Bsp .:-

verhindert, dass der Hyperlink der URL folgt, verhindert, dass die Schaltfläche zum Senden des Formulars verwendet wird. Wenn Sie über viele Event-Handler verfügen und einfach verhindern möchten, dass Standardereignisse auftreten, und das von vielen Zeitpunkten, dann müssen Für das, was wir oben in function () verwenden müssen. 

Grund:-

Der Grund, e.preventDefault(); zu verwenden, ist, dass in unserem Code etwas im Code schief geht. Dann wird es möglich, den Link oder das Formular auszuführen, um gesendet zu werden oder die Ausführung von Aktionen zuzulassen. Der Link & Senden oder Senden-Button wird übermittelt und ermöglicht die weitere Verbreitung des Ereignisses.

<!DOCTYPE html>
<html lang="en" dir="ltr">
   <head>
      <meta charset="utf-8">
      <title></title>
   </head>
   <body>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <a href="https://www.google.com" onclick="doSomethingElse()">Preventsss page from redirect</a>
      <script type="text/javascript">
         function doSomethingElse(){
           console.log("This is Test...");
         }
         $("a").click(function(e){
          e.preventDefault(); 
         });
      </script>
   </body>
</html>

falsch zurückgeben;

Es stoppt einfach die Ausführung der Funktion ().

"return false;" beendet die gesamte Ausführung des Prozesses.

Grund:-

Der Grund für die Verwendung von return false; ist, dass Sie die Funktion nicht mehr strikt ausführen möchten.

<!DOCTYPE html>
<html lang="en" dir="ltr">
   <head>
      <meta charset="utf-8">
      <title></title>
   </head>
   <body>
      <a href="#" onclick="returnFalse();">Blah</a>
      <script type="text/javascript">
         function returnFalse(){
         console.log("returns false without location redirection....")
             return false;
             location.href = "http://www.google.com/";
         
         }
      </script>
   </body>
</html>

Auf diese Art und Weise kombinieren Sie Dinge, weil jQuery ein Framework ist, das sich hauptsächlich auf HTML-Elemente konzentriert. Sie verhindern im Wesentlichen die Standardeinstellung, gleichzeitig stoppen Sie jedoch die Verbreitung.

Wir können also einfach sagen, dass false in jQuery gleich ist:

return false ist e.preventDefault UND e.stopPropagation

Vergessen Sie auch nicht, dass dies alles in jQuery- oder DOM-bezogenen Funktionen ist. Wenn Sie es für das Element ausführen, wird grundsätzlich verhindert, dass alles ausgelöst wird, einschließlich des Standardverhaltens und der Weitergabe des Ereignisses.

Bevor Sie mit return false; anfangen, sollten Sie zunächst verstehen, was e.preventDefault(); und e.stopPropagation(); tun. Wenn Sie der Meinung sind, dass Sie beide gleichzeitig benötigen, verwenden Sie es einfach.

Also im Grunde dieser Code unten:

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

ist gleich zu diesem Code:

$('div').click(function (event) {
  event.preventDefault();
  event.stopPropagation();
});

Aus meiner Erfahrung wird event.stopPropagation () meistens in CSS-Effekten oder Animationen verwendet, zum Beispiel wenn Sie einen Hover-Effekt für Karte und Schaltflächenelement haben. Wenn Sie den Mauszeiger über die Schaltfläche bewegen, wird in diesem Fall sowohl der Karten- als auch der Schaltflächen-Hover-Effekt ausgelöst Sie können event.stopPropagation () verwenden, um das Sprudeln von Aktionen zu stoppen, und event.preventDefault () dient zum Verhindern des Standardverhaltens von Browseraktionen. Beispielsweise haben Sie ein Formular, aber Sie haben nur ein Klickereignis für die Übermittlungsaktion definiert. Wenn der Benutzer das Formular durch Drücken der Eingabetaste übermittelt, der Browser durch ein Tastendruckereignis ausgelöst wird, und nicht Ihr Klickereignis, sollten Sie event.preventDefault () verwenden, um unangemessene Ereignisse zu vermeiden Verhalten. Ich weiß nicht, was zur Hölle falsch ist. Entschuldigung. Für weitere Erläuterungen besuchen Sie diesen Link und spielen Sie mit Zeile 33 https://www.codecademy.com/courses/introduction-to-javascript/lessons/requests-i/exercises/xhr-get-request-iv