nicht angemeldet
document objekt
3 0 0 2 
Der Martin
0
0
document objekt
Ich stell mich erstmal kurz vor :)
Ich bin der Jan, bin 18 bald 19 und neu im Forum hier. Also erstmal Entschuldigung, falls dieses Thema hier nicht hin gehört (was ich mal stark bezweifle).
So, nun zum Problem das ich habe.
Ich habe ein html Seite mit Formular...easy going soweit:
<html>
<head></head>
<body>
<script src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
<script language="JavaScript" src="wowrealmstatus.js"></script>
<form name="wowrealmstatusform" onsubmit="getrealmstatus()">
<input name="servername" type="text" autocomplete="off"></input>
</form>
<div id="realmstatuses"></div>
<script type="text/javascript">
getrealmstatus();
</script>
</body>
</html>
Die Funktion unten wird erwartungsgemäß ausgeführt usw.
Nun der gekürzte Quellcode der "wowrealmstatus.js" datei:
function getrealmstatus(){
server= document.wowrealmstatusform.servername.value;
$.getJSON("http://eu.battle.net/api/wow/realm/status?jsonp=?", function (realm) {
var allrealms="";
alert (server);
.
.
.
});}
Mein Problem ist folgendes:
"document.wowrealmstatusform.servername.value" liefert anfangs den richtigen Wert...also das eingegebene im Formular.Das hab ich mit einem direkt darauf folgenden alert getestet.
Wenn ich sie aber nun innerhalb der Funktion, nach der http-request an die URL, ausgeben will, gibt er mir ein leeres alert Fenster zurück.Auch wenn ich es in die Variable Server schiebe, welche wohlbemerkt global sein müsste.
meine Frage: Wieso? Vielleicht wär auch ein Lösungsansatz toll.. aber in erster Linie will ichs erstmal kapieren wieso o.O
-
Hi,
wenn man dein Formular absendet wird der onsubmit-handler aufgerufen und gleich im Anschluss das Formular abgesendet.
Da das action-Attribut leer ist wird es an die aktuelle Seite gesendet.
Es wird nicht gewartet bis dein AJAX-Request fertig ist, da dieser asynchron ausgeführt wird.Wenn du verhindern möchtest dass das Formular abgesendet wird könntest du einfach im submit-handler false zurück geben.
Ich habe auch sonst noch ein paar Anmerkungen zu deinem Code, die deine eigentliche Frage nicht direkt betreffen:
Du gibst keinen Doctype an. Das führt früher oder später zu unerwartetem Verhalten.
Du hast deine Skripte zu beginn des body-Elements. Das ist suboptimal, da der weitere Aufbau der Seite blockiert wird bis diese Skripte geladen wurden.
Das heißt das Formular und auch alles andere was nach den script-Elementen kommt wird erst angezeigt nachdem das/die Skript(e) geladen wurden.
Deshalb: Skripte ganz zum Schluss einbinden.Außerdem verwendest du bei einem Element das language-Attribut. Dieses Attribut ist absolut unsinnig und AFAIK sogar falsch(?).
Dafür hast du kein type-Attribut, falls du kein HTML5 schreibst ist dieses aber Pflicht.
Gibt es einen Grund warum du jQuery 1.5.2 verwendest und nicht das aktuelle 1.7.1?
Dann wenn du schon jQuery einbindest solltest du es auch konsequent verwenden. Das zählt bei jedem Framework.
Wenn man sich für eines entscheidet sollte man auch dabei bleiben, und nicht immer drum rum basteln o.ä.Das bedeutet konkret:
- Eventhandler nicht per onsubmit-Attribut zuweisen sondern über .bind (bzw. .on bei 1.7.1)
- Zugriff auf Elemente nicht über das document-Element (document.wowrealmstatusform.servername.value) sondern über $. In diesem Beispiel $('input[name=servername]').
- Code kapseln. Der Code sollte nicht direkt ausgeführt werden sondern erst wenn das DOM fertig ist. Das geht folgendermaßen:
$(function(){ // Hier deine Programmlogik });Umgebaut würde das Ganze dann so aussehen:
<!DOCTYPE html> <html> <head><title></title></head><!-- Das title-Element ist verpflichtend, aber ich denke da fehlt sowieso noch einiges --> <body> <form name="wowrealmstatusform"> <input name="servername" type="text" autocomplete="off" /><!-- input Element sind immer inhaltslos, d.h. sie dürfen kein schließendes </input>-Tag haben. Das hätte dir auch der [link:validator.w3c.org@title=Validator] gesagt. --> </form> <div id="realmstatuses"></div> <!-- da als Doctype HTML5 angegeben wurde kein type-Attribut erforderlich (und language sowieso nicht) --> <script src="http://code.jquery.com/jquery-1.5.2.min.js"></script> <script src="wowrealmstatus.js"></script> </body> </html>Das Javascript-File wäre wie folgt:
$(function(){ // Zur Kapselung des Codes, und warten bis das DOM fertig ist var server = $('input[name=servername]');// keine globale Variable (wäre böse!), Referenz auf das Objekt wird zwischengespeichert da es im Eventhandler ggf. öfter benötigt wird $('form[name=wowrealmstatusform]').bind('submit', // Zugriff wieder über jQuery-Methoden, zuweisen des submit-Handlers genauso function(e){// Das hier ist die Funktion die onsubmit aufgerufen werden soll, hier jetzt anonym e.preventDefault(); // als Argument bekommt diese das event-Objekt. Da du das Formular nicht absenden möchtest, was die Default-Aktion wäre, sagen wir hier "verhindere das" (Das ist das äquivalent zu "return false;" wenn der Handler über das Element-Attribut zugeweisen wurde) $.getJSON("http://eu.battle.net/api/wow/realm/status?jsonp=?", // Dein AJAX-Request function(realm){ // Dein Callback alert(server.val()); // server ist die Variable von weiter oben, hier holen wir den Wert (wieder über eine jQuery-Methode, ist ja auch ein jQuery-Objekt) }); }); });Fertig.
Würde mich freuen zu Erfahren ob mein Post für dich hilfreich war.
~dave
-
erstmal danke an alle mit ihren schnellen und hilfreichen antworten ^^
also:
1. ja , global oder nicht global hat was damit zu tun ob "var" benutzt wird oder nicht ;)2.
Ich habe auch sonst noch ein paar Anmerkungen zu deinem Code, die deine eigentliche Frage nicht direkt betreffen:
Du gibst keinen Doctype an. Das führt früher oder später zu unerwartetem Verhalten.
Das ist mir klar ^^ ... Bei solch einem Quellcode bisher vermutlich irrelevant , zumal es zu "Testzwecken" war. Bin auf einem technischen Gymnasium - Informationstechnikzweig ... soll kein anpöbeln sein, auch wenn es sich vielleicht so liest, wollte es nur erwähnt haben^^
Du hast deine Skripte zu beginn des body-Elements. Das ist suboptimal, da der weitere Aufbau der Seite blockiert wird bis diese Skripte geladen wurden.
Das heißt das Formular und auch alles andere was nach den script-Elementen kommt wird erst angezeigt nachdem das/die Skript(e) geladen wurden.
Deshalb: Skripte ganz zum Schluss einbinden.auch das ist mir klar :)
Außerdem verwendest du bei einem Element das language-Attribut. Dieses Attribut ist absolut unsinnig und AFAIK sogar falsch(?).
wäre mir persönlich jetzt nicht bewusst, dass es falsch wäre...(Lehrbuch)
Dafür hast du kein type-Attribut, falls du kein HTML5 schreibst ist dieses aber Pflicht.
ok, html5 hab ich mich noch nicht so damit beschäftigt.. danke für den tipp
- Eventhandler nicht per onsubmit-Attribut zuweisen sondern über .bind (bzw. .on bei 1.7.1)
- Zugriff auf Elemente nicht über das document-Element (document.wowrealmstatusform.servername.value) sondern über $. In diesem Beispiel $('input[name=servername]').
$(function(){ // Zur Kapselung des Codes, und warten bis das DOM fertig ist
var server = $('input[name=servername]');// keine globale Variable (wäre böse!), Referenz auf das Objekt wird zwischengespeichert da es im Eventhandler ggf. öfter benötigt wird
$('form[name=wowrealmstatusform]').bind('submit', // Zugriff wieder über jQuery-Methoden, zuweisen des submit-Handlers genauso
function(e){// Das hier ist die Funktion die onsubmit aufgerufen werden soll, hier jetzt anonyme.preventDefault(); // als Argument bekommt diese das event-Objekt. Da du das Formular nicht absenden möchtest, was die Default-Aktion wäre, sagen wir hier "verhindere das" (Das ist das äquivalent zu "return false;" wenn der Handler über das Element-Attribut zugeweisen wurde)
$.getJSON("http://eu.battle.net/api/wow/realm/status?jsonp=?", // Dein AJAX-Request
function(realm){ // Dein Callback
alert(server.val()); // server ist die Variable von weiter oben, hier holen wir den Wert (wieder über eine jQuery-Methode, ist ja auch ein jQuery-Objekt)
});
});
});> > Fertig. > > > Würde mich freuen zu Erfahren ob mein Post für dich hilfreich war. > > ~dave puh, erstmal schlucken ^^ ... ich bin offen und ehrlich, wir sind noch nicht so weit in der Schule, aber meistens bin ich eh weiter vorraus ... ich werde mich mal noch genauer irgendwo über eventhandler und co informieren und das dann morgen nochmal durchlesen ;) [code lang=javascript] ==>verstanden jquery hab ich die genommen, weil ich nur diese gefunden habe bzw. nicht näher geschaut habe... werd nochmal nachschauen ^^ Fazit, hilfreich war deine antwort auf alle fälle... hat mir auch noch gezeigt wo ich mich noch genauer informieren könnte :) ich meld mich nochmal so im laufe der tage danke an euch alle :)-
sry, bei der html5 zeile hab ich mich verlesen, die antwort von mir ist non-sense ;)
-
Hallo,
aber meistens bin ich eh weiter vorraus
aber in der Rrechtschrreibung anscheinend nicht.
Ciao,
Martin--
Treffen sich zwei Holzwürmer im Käse: "Na, auch Probleme mit den Zähnen?"
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(-
Tut mir Leid, im Internet achte ich einfach nicht so auf
Rrechtschreibung
, man kann sich,meiner Meinung nach, auch ohne Groß und Kleinschreibung relativ gut verständigen. Das Thema soll jetzt aber auch nicht zum Rechtschreibthema werden. Also:
Beide Kommentare ad Acta (für mich zumindenst). Wenn es den Antworten stören würde (wie z.b. dave und die anderen), welche etwas PRODUKTIVES beitragen, würde ich höflicherweise mehr drauf achten. Wenn aber so jemand jetzt kommt, krieg ich schon wieder so eine krawatte -.--
Tut mir Leid, im Internet achte ich einfach nicht so auf
Rrechtschreibung
, man kann sich,meiner Meinung nach, auch ohne Groß und Kleinschreibung relativ gut verständigen.Hmmm, verstehen wir das? Scheinbar hast du Deinen eigenen Rechtschreibfehler übersehen? Der Martin gab Dir doch so einen schönen subtilen Hinweis! Ach, so subtil war der eigentlich gar nicht.
-
-
-
Hallo,
erstmal danke an alle mit ihren schnellen und hilfreichen antworten ^^
also:- ja , global oder nicht global hat was damit zu tun ob "var" benutzt wird oder nicht ;)
Naja, hat es, aber es hat eigentlich etwas mit "schlechtem" Programmierstil zu tun (= Variablen _immer_ deklarieren!) bzw./oder ist ein "bad part" der Sprache:
"JavaScript's biggest problem is its dependence on global variables, particularly implied global variables. If a variable is not explicitly declared (usually with the var statement), then JavaScript assumes that the variable was global. This can mask misspelled names and other problems."
http://www.jslint.com/lint.htmlGruß
jobo
-
Hi Jan,
<input name="servername" type="text" autocomplete="off"></input>
input ist ein sog. leeres tag...
... die Variable Server ..., welche wohlbemerkt global sein müsste.
bist du sicher? Außerdem hilft manchmal auch eine Variable als solche zu deklarieren...
ciao holter
-
Hi,
input ist ein sog. leeres tag...
Das ist falsch. Es ist ein Element.
... die Variable Server ..., welche wohlbemerkt global sein müsste.
bist du sicher? Außerdem hilft manchmal auch eine Variable als solche zu deklarieren...
Auch ohne das Schlüsselwort var deklarierte Variablen sind Variablen. Nur eben globale.
Oder meintest du etwas anderes?~dave
-
Hallo,
Auch ohne das Schlüsselwort var deklarierte Variablen sind Variablen. Nur eben globale.
Oder meintest du etwas anderes?"var" hat was mit global oder nicht global zu tun? variablen im globalen scope sind doch immer global. im scope einer funktion eben nur in deren scope.
Gruß
jobo
-
Hi,
"var" hat was mit global oder nicht global zu tun?
Ja.
variablen im globalen scope sind doch immer global. im scope einer funktion eben nur in deren scope.
Nein, letzteres eben nur, wenn sie mit var deklariert sind.
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?-
Hallo,
Hi,
"var" hat was mit global oder nicht global zu tun?
Ja.
variablen im globalen scope sind doch immer global. im scope einer funktion eben nur in deren scope.
Nein, letzteres eben nur, wenn sie mit var deklariert sind.
O.k., da ich JSLint immer wieder benutze und wie ich bei http://coffeescript.org/ grade las, sollten Variablen ja sowieso deklariert werden. Werden sie nicht innerhalb einer Funktion mit var deklariert geht dann JS davon aus, dass sie im globalen Scope hätten deklariert werden müssen (gehört dann wohl weniger zu den "good parts", dass JS das so korrigiert).
Gruß
jobo
-
O.k., da ich JSLint immer wieder benutze und wie ich bei http://coffeescript.org/ grade las, sollten Variablen ja sowieso deklariert werden.
Klar, denn eine Variable, die nicht deklariert wird, ist keine Variable. ;)
Bei einer Wertzuweisung an einen beliebigen Bezeichner (foo = 'bar') wird in der Scope Chain gesucht, und wenn keine lokale Funktionsvariable oder kein Parameter mit dem Bezeichner gefunden wird, wird letztlich beim globalen Objekt eine Property angelegt.
Werden sie nicht innerhalb einer Funktion mit var deklariert geht dann JS davon aus, dass sie im globalen Scope hätten deklariert werden müssen (gehört dann wohl weniger zu den "good parts", dass JS das so korrigiert).
Dieser Fehler ist im ECMAScript 5 Strict Mode nicht mehr möglich, weshalb man tunlichst den Strict Mode verwenden sollte.
Mathias
-
-
-
-
-