Warum funktioniert mein JSFiddle-Code nicht auf meiner eigenen Website?

JSFiddle-Code funktioniert nicht auf der eigenen Seite: Fehlerbehebung bei der JavaScript-Ausführung

Sie sind auf ein Problem gestoßen, bei dem Code, der in JSFiddle einwandfrei funktioniert, nicht richtig funktioniert in Ihre eigene Webseite eingebunden. Um dieses verwirrende Problem zu lösen, untersuchen wir die zugrunde liegenden Ursachen.

Der Schuldige liegt in der Platzierung des JavaScript-Codes. In JSFiddle ist es in einen Onload-Handler eingebettet, der sicherstellt, dass es ausgeführt wird, nachdem die gesamte Seite geladen wurde. Wenn Sie den Code jedoch direkt in Ihre im Kopf verknüpften HTML/JS- und CSS-Dateien einbinden, wird er vorzeitig ausgeführt.

Zu diesem Zeitpunkt wurden die Eingabeelemente noch nicht analysiert, was zu $('input [type="range"]'), um keine Ergebnisse zu liefern. Um dies zu beheben, muss Ihr Code ausgeführt werden, nachdem alle Seitenelemente verarbeitet wurden.

Lösung: Onload-Handler oder Document Ready Handler

Um dies zu erreichen, können Sie umbrechen Ihr Code in einem Onload-Handler:

window.onload = function() {
    // your code here
};

Alternativ können Sie das Dokument von jQuery verwenden Handler:

$(document).ready(function() {
    // your code here
});

Oder Skript am Ende der Seite einschließen

Eine andere Möglichkeit besteht darin, das Skript am Ende der Seite einzufügen, was garantiert, dass es danach ausgeführt wird Alle Elemente wurden analysiert.

Fazit

Durch Auflösen In diesem Fall stellen Sie sicher, dass sich Ihr JavaScript-Code sowohl in JSFiddle als auch auf Ihrer eigenen Webseite konsistent verhält. Denken Sie daran, den Ausführungszeitpunkt Ihres JavaScript-Codes zu berücksichtigen, um ähnliche Fallstricke in Zukunft zu vermeiden.

Das obige ist der detaillierte Inhalt vonWarum funktioniert mein JSFiddle-Code nicht auf meiner eigenen Website?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!