Heim >Web-Frontend >js-Tutorial >Warum wird meine JavaScript-Funktion beim Klicken auf einen Link nicht ausgeführt?
Eine Webseite besteht aus einer Seitenleistennavigation und einem Iframe zum Anzeigen von Inhalten. Die Navigation enthält Links, die den Inhalt des Iframes ändern sollen. Die JavaScript-Funktion zum Ändern der Iframe-Quelle funktioniert jedoch nicht.
Das Hauptproblem entstand durch das Weglassen der Klammern, die zum Ausführen der getContent-Funktion im Onclick-Ereignishandler erforderlich waren.
Inline-Ereignisse vermeiden Handler
Von der Verwendung von Inline-Ereignishandlern (z. B. onclick, onmouseover) wird dringend abgeraten, da dies zu Spaghetti-Code, Codeduplizierung, Skalierbarkeitsproblemen und Abweichungen von Best Practices führt.
Trennen Sie HTML und JavaScript
Behalten Sie Ihren HTML- und JavaScript-Code Separat für bessere Lesbarkeit und einfachere Wartung.
Linknavigation für Schaltflächen deaktivieren
Wenn Sie einen Link für ein schaltflächenähnliches Element verwenden, setzen Sie dessen href-Attribut auf # statt „“, um die Navigation zu verhindern.
Unten finden Sie den überarbeiteten Code mit den Korrekturen apply:
<br>function getContent() {<br> console.log("Alte Quelle war: " iFrame.src);<br> iFrame.src="LoremIpsum.html" ;<br> console.log("Neue Quelle ist: " iFrame.src);<br>}</p> <p>// Holen Sie sich eine Referenz auf die Schaltfläche und den Iframe<br>var btn = document.getElementById("btnChangeSrc");<br>var iFrame = document.getElementById("contentFrame");</p> <p>// Einrichten eines Klicken Sie auf den Ereignishandler für die Schaltfläche<br>btn.addEventListener("click", getContent);<br>
Das obige ist der detaillierte Inhalt vonWarum wird meine JavaScript-Funktion beim Klicken auf einen Link nicht ausgeführt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!