Heim > Web-Frontend > js-Tutorial > Warum funktioniert mein JavaScript-Code lokal, aber nicht auf JSfiddle.net?

Warum funktioniert mein JavaScript-Code lokal, aber nicht auf JSfiddle.net?

Barbara Streisand
Freigeben: 2024-10-31 21:55:02
Original
571 Leute haben es durchsucht

Why Does My JavaScript Code Work Locally But Not on JSfiddle.net?

JavaScript läuft nicht auf JSfiddle.net

Problem:

Der bereitgestellte Code funktioniert auf einer Live-Site ordnungsgemäß, schlägt jedoch fehl auf JSfiddle.net auszuführen, was zu Konsolenfehlern wie „ReferenceError: fillList is not definiert“ und „ReferenceError: mySelectList is not definiert“ führt.

Erklärung:

Im angegebenen Code sind die Funktionen innerhalb einer Onload-Funktion definiert. Dies ermöglicht zwar die Referenzierung der Funktionen innerhalb dieser Funktion, der globale Zugriff ist jedoch nicht möglich. Wenn Sie diese Funktionen aus dem HTML heraus mit ihren globalen Namen (z. B. fillList() und mySelectList) referenzieren, kann JSfiddle sie daher nicht erkennen.

Lösungen:

Es gibt drei Hauptlösungen für dieses Problem:

a) Funktionen globalisieren:

<code class="javascript">window.fillList = function() {};
window.mySelectList = function() {};</code>
Nach dem Login kopieren

Dieser Ansatz macht die Funktionen global, ist aber nicht ideal, da er die verschmutzt globaler Namespace.

b) Verwenden Sie unaufdringliches JavaScript:

Definieren Sie Funktionen außerhalb der Onload-Funktion und hängen Sie Ereignis-Listener allein mit JavaScript an:

<code class="javascript">function fillList() {}
function mySelectList() {}

window.onload = function() {
  var e = document.getElementById('elementId');
  e.addEventListener('click', fillList);
};</code>
Nach dem Login kopieren

Diese Trennung von HTML und JavaScript ist eine bewährte Methode.

c) Ändern Sie die JSfiddle-Einstellungen:

Ändern Sie die JSfiddle-Einstellungen auf „Kein Wrap (Kopf oder Körper)“. Verhindern Sie, dass der Code in eine Onload-Funktion eingeschlossen wird. Dadurch sind die Funktionen global zugänglich.

Das obige ist der detaillierte Inhalt vonWarum funktioniert mein JavaScript-Code lokal, aber nicht auf JSfiddle.net?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage