JQuery Kochbuch (German Edition)

globalen Gültigkeitsbereich ausgeführt wird – als würde sich der Code außerhalb jeglicher Funktion befinden. Am einfachsten kann man dies lösen, indem man für den Callback anstatt eines Text-Strings eine lokale Funktion nutzt:
function delayLog( text ) {
    setTimeout( function() {
     alert(text);
    }, 1000 );
}
    Anders als Code in einem String hat eine verschachtelte Funktion vollständigen Zugriff auf die Variablen und Parameter außerhalb der Funktion. So wird dieser Code den Code wie gewünscht ausgeben.
    Und schließlich hier eine korrigierte Version des ursprünglichen jQuery-Codes:
function delayLog( text ) {
    setTimeout( function() {
     $('#log').show().html(text);
    }, 1000 );
}
    Diskussion
    Wenn Sie debuggen und sich nicht sicher sind, was ein Problem verursacht, kann es helfen, herauszufinden, was das Problem nicht verursacht. Dieses Rezept soll Ihnen nicht dabei helfen, Probleme mit
setTimeout()
zu lösen – schließlich handelt es sich hier um ein jQuery-Buch, nicht um ein allgemeines JavaScript-Buch – sondern Ihre Debugging-Versuche auf den Kern des Problems zu lenken, indem Sie jQuery als Quelle des Problems zügig ausschließen (oder bestätigen!) können.

In jQuery debuggen
    Problem 1
    Sie nutzen »Step Into« in Firebug oder einem anderen JavaScript-Debugger und versuchen, durch den jQuery-Code zu debuggen, um herauszufinden, was dort genau passiert. Wenn Sie aber in diese Stelle hineinspringen, sehen Sie nur eine lange, unlesbare Codezeile, durch die Sie nicht schrittweise debuggen können:
(function(){var l=this,g,y=l.jQuery,p=l.$,o=l.jQuery=l.$=function(E,F)...
    Lösung 1
    Sie nutzen die minifizierte Version von jQuery.Laden Sie stattdessen die unkomprimierte Version von jQuery auf Ihrer Seite, solange Sie testen.
    Nutzen Sie den Code der Google Ajax Libraries API in einem

    Falls Sie Googles JavaScript-Loaded verwenden, ändern Sie ihn wie folgt:
// Auskommentieren der minifizierten Version von jQuery
// google.load( 'jquery', '1.3.2' );
// Verwenden der unkomprimierten Version zum Testen
google.load( 'jquery', '1.3.2' , { uncompressed:true } );
    Jetzt können Sie auch den jQuery-Code Schritt für Schritt debuggen.
    Problem 2
    Nachdem Sie dieses Problem gelöst haben, wollen Sie herausfinden, wie die jQuery-Methoden
.html()
und
.show()
arbeiten. Also versuchen Sie, im Debugger in diesem Code in die Methode hineinzuspringen:
$('#test').html( 'test' ).show();
    Wenn Sie aber den Befehl »Step Into« nutzen, springt der Debugger in den jQuery-Konstruktor und nicht in eine der Methoden, an denen Sie interessiert sind.
    Lösung 2
    Die vorige Codezeile enthält drei Funktionsaufrufe – den für den jQuery-Konstruktor (
$
), gefolgt von den Aufrufen der Methoden
.html()
und
.show()
. DerBefehl »Step Into« springt dabei in den ersten dieser Aufrufe – den Konstruktor.
    Hier können Sie direkt ein Step Out, gefolgt von einem weiteren Step In ausführen. Diese Schritte führen Sie aus dem jQuery-Konstruktor heraus (und bringen Sie in die Mitte der ursprünglichen Codezeile) und dann in die
.html()
.Methode hinein.
    Um zur Methode
.show()
zu gelangen, nutzen Sie nochmals das Anweisungspaar »Step Out« und »Step In«. Dabei springen Sie in der jQuery-Kette jedes Mal einen Schritt weiter.
    Wenn Ihnen das zu nervig wird, brechen Sie die Kette wie in Debuggen? Sprengen Sie die Ketten beschrieben auf und fügen dort
debugger;
-Anweisungen ein, wo Sie unterbrechen wollen. Um also zum Beispiel die
.show()
-Methode genauer anschauen zu können, ändern Sie den Code wie folgt:
var $test = $('#test');
$test.html( 'test' );
debugger;
$test.show();
    Wenn der Code nun an der
debugger;
-Anweisung anhält, können Sie einfach »Step In« nutzen (allerdings zwei Mal – mit dem ersten Aufruf gelangen Sie zu
$test.show();
und mit dem zweiten dann in die Methode).
    ----
    Note
    Sie können von der
debugger;
-Anweisung aus auch »Step Over« nutzen, da Sie ja nicht »in« etwas hineinspringen, aber es ist einfacher, zwei Mal »Step Into« anzuklicken (oder unter Windows F11 zu drücken). Statt der
debugger;
-Anweisung