JavaScript-Onclick-Funktion wurde vorzeitig ausgelöst

Beim Erstellen eines Links mit ähnlicher Ästhetik wie ein -Tag, der jedoch beim Klicken eine Funktion ausführen soll können Benutzer auf ein Szenario stoßen, in dem die Funktion beim Laden der Seite fälschlicherweise aufgerufen wird. Dies verhindert, dass das gewünschte Klickereignis ordnungsgemäß funktioniert.

Die häufigste Gefahr ist die unsachgemäße Verwendung von Klammern bei der Zuweisung des onclick-Attributs. Anstelle von sentNode.onclick = secondFunction(), das die Funktion sofort ausführt, lautet die korrekte Syntax sentNode.onclick = secondFunction. Dadurch wird der Funktion eine Referenz zugewiesen, die nur beim Klickereignis ausgeführt wird.

function startFunction() {
  var sentNode = document.createElement('a');
  sentNode.setAttribute('href', "#");
  sentNode.setAttribute('onclick', secondFunction);
  //sentNode.onclick = secondFunction();
  sentNode.innerHTML = "Sent Items";
  //...
}

Durch Weglassen der Klammern wird das onclick-Ereignis korrekt an eine Funktionsreferenz und nicht an das Ergebnis seiner Ausführung gebunden, wodurch das beabsichtigte Verhalten sichergestellt wird.