Wie übergebe ich ein Ereignisobjekt an eine Funktion in Javascript?

Question 1

<button type="button" value="click me" onclick="check_me();" />

function check_me() {
  //event.preventDefault();
  var hello = document.myForm.username.value;
  var err = '';

  if(hello == '' || hello == null) {
    err = 'User name required';
  }

  if(err != '') { 
     alert(err); 
     $('username').focus(); 
     return false; 
   } else { 
    return true; }
}

Wenn ich in Firefox versuche, einen leeren Wert zu senden, wird der Fehler ausgelöst und der Fokus wieder auf das Element gesetzt. Aber im IE passiert nicht dasselbe, da es einen Fehler auslöst und nach dem Klicken auf OK das Formular veröffentlicht (gibt true zurück).

Wie kann ich das vermeiden? Ich habe überlegt, dies zu vermeiden event.preventDefault(), bin mir aber nicht sicher, wie ich das mit dieser Methode machen soll. Ich habe versucht zu bestehen checkme(event).. aber es hat nicht funktioniert. Ich benutze Prototype js.

(Ich weiß, wie man ein Ereignis übergibt, wenn ich eine .click-Funktion in Javascript binde .. anstatt onclickinnerhalb von html .. mit Jquery aufzurufen, aber ich muss diesen Code debuggen)

Question 2

Obwohl dies die akzeptierte Antwort ist, ist die Antwort von toto_tico unten besser :)

Versuchen Sie, den Onclick js dazu zu bringen, 'return' zu verwenden, um sicherzustellen, dass der gewünschte Rückgabewert verwendet wird ...

<button type="button" value="click me" onclick="return check_me();" />

Question 3

Ändern Sie die Definition der Funktion check_me als ::
```
 function check_me(ev) {
```
Jetzt können Sie auf die Methoden und Parameter des Ereignisses zugreifen, in Ihrem Fall:
```
 ev.preventDefault();
```
Dann müssen Sie den Parameter beim Einklick im Inline-Aufruf übergeben ::
```
 <button type="button" onclick="check_me(event);">Click Me!</button>
```

Ein nützlicher Link , um dies zu verstehen.

Vollständiges Beispiel:

<!DOCTYPE html>
<html lang="en">
  <head>
    <script type="text/javascript">
      function check_me(ev) {
        ev.preventDefault();
        alert("Hello World!")
      }
    </script>
  </head>
  <body>
    <button type="button" onclick="check_me(event);">Click Me!</button>
  </body>
</html>

Alternativen (Best Practices):

Obwohl das Obige die direkte Antwort auf die Frage ist ( Übergeben eines Ereignisobjekts an ein Inline-Ereignis ), gibt es andere Möglichkeiten, Ereignisse zu behandeln, die die Logik von der Präsentation trennen

A. Verwenden von `addEventListener`:

<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    <button id='my_button' type="button">Click Me!</button>

    <!-- put the javascript at the end to guarantee that the DOM is ready to use-->
    <script type="text/javascript">
      function check_me(ev) {
        ev.preventDefault();
        alert("Hello World!")
      }
      
      <!-- add the event to the button identified #my_button -->
      document.getElementById("my_button").addEventListener("click", check_me);
    </script>
  </body>
</html>

B. Isolieren von Javascript:

Beide oben genannten Lösungen eignen sich gut für ein kleines Projekt oder eine hackige, schnelle und schmutzige Lösung. Bei größeren Projekten ist es jedoch besser, den HTML- Code vom Javascript zu trennen.

Legen Sie einfach diese beiden Dateien in den gleichen Ordner:

example.html:

<!DOCTYPE html>
<html lang="en">
  <head>
  </head>
  <body>
    <button id='my_button' type="button">Click Me!</button>

    <!-- put the javascript at the end to guarantee that the DOM is ready to use-->
    <script type="text/javascript" src="example.js"></script>
  </body>
</html>

example.js:

function check_me(ev) {
    ev.preventDefault();
    alert("Hello World!")
}
document.getElementById("my_button").addEventListener("click", check_me);

Question 4

Ich würde Ihre Bindung ändern, um zu sein:

<button type="button" value="click me" onclick="check_me" />

Ich würde dann Ihre check_me()Funktionsdeklaration wie folgt ändern :

function check_me() {   
  //event.preventDefault();
  var hello = document.myForm.username.value;
  var err = '';

  if(hello == '' || hello == null) {
    err = 'User name required';
  }

  if(err != '') { 
     alert(err); 
     $('username').focus(); 
     event.preventDefault(); 
   } else { 
    return true; }
}

Wie übergebe ich ein Ereignisobjekt an eine Funktion in Javascript?

Vollständiges Beispiel:

Alternativen (Best Practices):

A. Verwenden von addEventListener:

B. Isolieren von Javascript:

A. Verwenden von `addEventListener`: