Javascript: Funktionen werden beim Laden der Seite aufgerufen anstatt onclick/onsubmit

Question

Ich bin relativ neu in JS, aber ich habe in C vor programmiert, und ich versuche, meinen Kopf rund um die gesamte Event-gesteuerte Natur davon zu bekommen. Ich versuche, ein Skript zu erstellen, das Formulareingabe validiert, jedoch wird mein gesamter Code ausgeführt - alles innerhalb von if/else, Schleifen, was hast du - unabhängig davon, ob das Ereignis passiert oder nicht. Um zu testen, und um es einfacher zu machen, hier zu posten, habe ich ein einfaches Programm geschrieben, das dieses Problem auch hat.

HTML:

<button id="test">Test</button> 

Javascript:

function init(){ 
    document.getElementById("test").onclick = alert("hello"); 
} 

window.onload = init; 

Von dem, was ich verstehe, sollte die init-Funktion aufgerufen werden, wenn die Seite geladen wird (window.onload) und der Alarm sollte Pop-up, wenn Der Button mit der ID "test" wird angeklickt (onclick). Was tatsächlich passiert, ist, dass die Warnung erscheint, sobald die Seite geladen wird, und wieder auftaucht, wenn ich die Taste drücke.

Mein Denken ist, dass ich einige falsche Annahmen über die Reihenfolge gemacht habe, in der JS ausgeführt wird, aber ich kann nicht denken, was das ist. Kann das irgendjemand beleuchten?

Answer 1

Das ist nicht richtig, es sein sollte:

function init(){ 
    document.getElementById("test").onclick = function() { alert("hello"); }; 
} 

Dies liegt daran, dass Sie in JavaScript benötigen müssen Sie die Funktion selbst zum click Ereignisse zuweisen (Alarm ist eine Funktion).

Nehmen Sie dies zum Beispiel:

function hello() { 
    alert("hello"); 
} 

document.getElementById("test").onclick = hello; 

Bitte beachte, dass ich nicht die Klammern () nach hello Funktion gelegt hat? Das liegt daran, dass ich einen Verweis auf die Funktion selbst verwende. Wenn ich die Klammern setze, bin ich tatsächlich Auswertung, die Funktion zum Zeitpunkt der Klickzuordnung geschieht.

So tun:

document.getElementById("test").onclick = hello(); 

die Warnung zeigen Wird die alertsofort zeigen, nachdem diese Zeile ausgeführt wurde.

Answer 2

ja Ihre JavaScript-Funktion wird nur aufrufen, wenn Seite lädt .Wenn Sie wollen auch, dass die init() aufrufen Funktion auf Klick-Test-Taste, so versuchen Sie es wie folgt aus:

JavaScript:

function init(){ alert("hello"); } 
 

 
window.onload = init;

HTML: 
 
<button id="test" onClick='init()'>Test</button>