Verfasst von: bletra | 24. November 2011

JavaScript: Globale Variablen bei Event-Handlern

Gestern im Praktikum habe ich ein seltsames Verhalten beim Zusammenspiel von JavaScript und HTML kennen gelernt:Innerhalb eines click-Events sind je nach Browser Elemente mit einer id unter dieser id als globale Variable verwendbar. Der aktuelle IE macht dabei alle Ids verfügbar, während Firefox nur die Ids innerhalb des gleichen Formulars kennt. Betrachten Sie hierzu folgendes Beispiel:

<h1>Demo Auto-Globals</h1>
<input type="text" name="name2" id="name2" />
<form accept-charset="utf-8" method="get" action="demo.html">
<div>
<label for="firstName">Vorname:</label><input type="text" name="name" id="firstName" /><span id="x"></span>
<button onclick="alert(firstName);">test von firstName</button>
<button onclick="alert(name2);alert(x);">test von span-Element und input außerhalb</button>
</div>
</form>

Der erste Button zeigt sowohl im IE als auch im Firefox die Variable firstName als Input-Element an. Beim zweiten Button wird im Firefox nichts ausgegeben, während der IE sowohl das außerhalb des Form-Tags gelegene Input-Element als solches kennt, als auch das span-Tag.
Möchte man diese Variablen dagegen per JavaScript innerhalb des Script-Tags oder innerhalb einer eingebundenen JavaScript-Datei verwenden, so stehen sie nicht zur Verfügung.
Folgender Code zeigt somit nichts an:

function globals()
{
  alert(firstName);
}

mit HTML-Code:

<button onclick="demo();">input-global in JS unbekannt</button>

Falls Sie mit Objektschablonen und globalen „Instanzen“ arbeiten, dann achten Sie darauf, diese globalen Variablen anders alle alle Ids Ihrer HTML-Tags zu nennen. Wie gesagt, diese nur den Click-Handlern bekannten Globals haben mich sehr überrascht.

Advertisements

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s

Kategorien

%d Bloggern gefällt das: