Funktionsaufruf ohne eventhandler

[Javascript-Beginner]

Hallo Forum,

Ich hatte eine schöne Javascriptfunktion, die ich am Ende des Scriptes einfach aufgerufen hatte und die mir dann den Style meines Divs veränderte.

Nun bin ich dazu übergegangen, das ganze halb serverseitig, halb clientseitig umzustricken. Das mache ich mit Ajax.

Soweit, so gut.

Aber meine Styleveränderung bekomme ich nicht mehr zustande.

Hier mal der Code:

  
<script type="text/javascript">  
var auto_refresh = setInterval(  
function ()  
{  
$('#reloaddiv').load('reload.php').fadeIn("slow");  
}, 10000); // refresh every 10000 milliseconds  
</script>  

... später im body-tag

  
<div id="reloaddiv">  
<div id="aenderdiv"></div>  
</div>  

... und das php-script:

  
echo("  
<script type=\"text/javascript\">  
zaehle();  
function zaehle()  
{  
document.getElementById('aenderdiv').style.width = ...  
</script>  
");  

Ich vermute, dass die Funktion "zaehle" so ohne Eventhandler nicht aufgerufen wird.

Ist das richtig? Und wie müßte ich sie ohne Eventhandler aufrufen?

Helft mir bitte mal auf die Sprünge.

Günni

[LX]

War fast korrekt, bis auf die Reihenfolge. Erst definieren, dann aufrufen.

Gruß, LX

[Javascript-Beginner]

War fast korrekt, bis auf die Reihenfolge. Erst definieren, dann aufrufen.

Hallo LX,

habe ich soeben versucht. Leider ohne Erfolg. :-(

Trotzdem danke für Dein Angebot.

Günni

[Fabulit]

War fast korrekt, bis auf die Reihenfolge. Erst definieren, dann aufrufen.

Zwischenfrage: Ich bin bisher davon ausgegangen, dass die Reihenfolge unerheblich sei, da im ersten Schritt das gesamte Skript "geparsed"* wird und erst anschließend Funktionsaufrufe stattfinden.

Kannst Du mir da bitte Schlagworte oder Links nennen, so dass ich mich noch mal zu dem Thema informieren kann. Vielen Dank

Gruß Fabulit

*Terminologie mag unpassend sein.

[molily]

Ich bin bisher davon ausgegangen, dass die Reihenfolge unerheblich sei, da im ersten Schritt das gesamte Skript "geparsed"* wird und erst anschließend Funktionsaufrufe stattfinden.

Das Parsing passiert immer am Anfang, dann hat man den Syntaxbaum und dann wird das Script ausgeführt.
Bei der Ausführung eines Kontextes werden jedoch Funktionsdeklarationen und Variablendeklarationen zuerst ausgewertet.

Kannst Du mir da bitte Schlagworte oder Links nennen, so dass ich mich noch mal zu dem Thema informieren kann.

Hoisting von Function Declarations

http://molily.de/javascript-core/
http://dmitrysoshnikov.com/ecmascript/chapter-2-variable-object/
http://dmitrysoshnikov.com/notes/note-4-two-words-about-hoisting/
http://bonsaiden.github.com/JavaScript-Garden/#function.scopes
http://javascriptweblog.wordpress.com/2010/07/06/function-declarations-vs-function-expressions/
http://es5.github.com/#x10.2

Mathias

[Gunnar Bittersmann]

@@LX:

nuqneH

War fast korrekt, bis auf die Reihenfolge. Erst definieren, dann aufrufen.

Nö, das ist egal. Das funtioniert prächtig:

foo();  
function foo() { alert('foo called.'); }

Im Gegensatz zu

foo(); // foo ist not a function  
var foo = function () { alert('foo called.'); }

Das geht nur so rum:

var foo = function () { alert('foo called.'); }  
foo();

Qapla'

[LX]

Entschuldige bitte. Ich hatte Dein Problem missverstanden. Tatsächlich kannst Du das callback-Argument von jQuery.load verwenden:

function zaehle(){  
  document.getElementById('aenderdiv').style.width = ...  
}  
window.setTimeout(function(){  
                       //url         //callback  
  $('#reloaddiv').load('reload.php', zaehle).fadeIn('slow');  
}, 10000)

Gruß, LX

[Javascript-Beginner]

Entschuldige bitte. Ich hatte Dein Problem missverstanden. Tatsächlich kannst Du das callback-Argument von jQuery.load verwenden:

Hi LX,

um was zu erreichen?

Ich glaube, ich versteh nicht ganz, was Du meinst :-(

Kannst Du noch etwas genauer darauf eingehen?

Viele Grüße, Günni

[LX]

Um zu erreichen, dass die Funktion jeweils nach dem Laden aufgerufen wird - das wolltest Du doch, oder habe ich Dich schon wieder falsch verstanden?

Gruß, LX

[Javascript-Beginner]

Um zu erreichen, dass die Funktion jeweils nach dem Laden aufgerufen wird - das wolltest Du doch, oder habe ich Dich schon wieder falsch verstanden?

Hi LX,

nein, Du hast mich bestimmt richtig verstanden, aber ich steh grad auf dem Schlauch. Wie macht man das mit Hilfe des callback-Arguments denn?

Viele Grüße, Günni

[Javascript-Beginner]

Um zu erreichen, dass die Funktion jeweils nach dem Laden aufgerufen wird - das wolltest Du doch, oder habe ich Dich schon wieder falsch verstanden?

Hi LX,

sorry, ich hatte nicht gerafft, dass Du mir schon die Lösung über callback gegeben hattest :-(

Aber leider funktioniert es so nicht.

  
<html>  
<head>  
<script type="text/javascript" src="./jquery.min.js"></script>  
<script type="text/javascript">  
function zaehle(){  
// mach mal nix  
}  
window.setTimeout(function(){  
                          //url         //callback  
  $('#load_tweets').load('reload.php', zaehle).fadeIn('slow');  
}, 1000)  
</script>  
</head>  
 <body>  
<h1>Reload Testing ...</h1>  
<div id="load_tweets">&nbsp;</div>  
<h3>Test</h3>  
</body>  
</html>  

Es wird nicht aktualisiert.

In meiner reload.php steht:

<?php
echo("RELOAD Test: ".time());
?>

So müßte ja sekündlich aktualisiert werden. Das geschieht aber leider nicht.

Viele Grüße, Günni

[molily]

Hallo,

[code lang=html]
<html>

Du solltest am Dokumentanfang eine eine DOCTYPE-Deklaration einfügen, damit die Browser im standardkonformen Modus arbeiten.

Beispielsweise <!DOCTYPE html>

window.setTimeout(function(){
                          //url         //callback
  $('#load_tweets').load('reload.php', zaehle).fadeIn('slow');
}, 1000)
</script>
</head>
<body>
<h1>Reload Testing ...</h1>
<div id="load_tweets">&nbsp;</div>
<h3>Test</h3>
</body>
</html>

So müßte ja sekündlich aktualisiert werden. Das geschieht aber leider nicht.

Das div, auf das du zugreifst, steht im DOM nach dem Script. Das ist nicht unbedingt ein Problem, da du um eine Sekunde verzögert darauf zugreifst. Generell solltest du aber JavaScripte nach DOM-Ready starten.

Zudem verwendest du plötzlich setTimeout statt setInterval. Die Funktion wird daher nur einmal ausgeführt, nicht jede Sekunde. Wenn du sie sekündlich ausführen willst, musst du schon setInterval oder eine Kette von setTimeout verwenden.

Wenn nichts zu passieren scheint, so schaue in der Fehlerkonsole des Browsers und baue Kontrollausgaben ein, um den Programmablauf nachzuvollziehen.
http://molily.de/js/werkzeuge.html#fehlerkonsole
http://molily.de/js/werkzeuge.html#fehlersuche

Mathias

[Javascript-Beginner]

Hi Mathias,

Zudem verwendest du plötzlich setTimeout statt setInterval. Die Funktion wird daher nur einmal ausgeführt, nicht jede Sekunde. Wenn du sie sekündlich ausführen willst, musst du schon setInterval oder eine Kette von setTimeout verwenden.

Ah, vielen Dank! :-)

Jetzt funktioniert das Ganze. Bleibt zwar immer noch viel Strickerei für mich zwischen php und Javascript, aber das Grundgerüst tuts schonmal.

Gruß an Dich und natürlich auch T-REX für den Tip

Günni

[Javascript-Beginner]

Hi nochmal,

  
function zaehle(){  
  document.getElementById('aenderdiv').style.width = ...  
}  
window.setInterval(function(){  
                       //url         //callback  
  $('#reloaddiv').load('reload.php', zaehle).fadeIn('slow');  
}, 10000)  

Mein Problem ist nun, dass ich in der Funktion zaehle() Werte benötige, die das Script reload.php erst liefern müsste.

Von der Reihenfolge her sollte also erst reload.php die Werte aus MySQL holen und dann an die Funktion zaehle() geben.

Wie muss ich das denn machen?

Viele Grüße, Günni

[dave]

Hi,

ich hab jetzt auf die schnelle nicht gefunden welches Framework du verwendest, ich tippe auf jQuery?

Von der Reihenfolge her sollte also erst reload.php die Werte aus MySQL holen und dann an die Funktion zaehle() geben.

In der Doku von jQuery steht auch wie das geht. Nämlich von ganz "alleine"

Wie muss ich das denn machen?

Deine Callback-Funktion bekommt den responseText als Argument übergeben, du musst den nur wie gewünscht auswerten.

~dave

[Günni]

Hi,

In der Doku von jQuery steht auch wie das geht. Nämlich von ganz "alleine"

Wie muss ich das denn machen?

Deine Callback-Funktion bekommt den responseText als Argument übergeben, du musst den nur wie gewünscht auswerten.

Verstehe ich nicht. Wie übergebe ich denn aus dem reload-script die Werte? Und wie kommen die da an? Als php-array? Als javascript?

Günni