jQuery vs. Callback

she3p · Mrz 16, 2011

Huhu

Könnte mir jemand erläutern, warum bei .load() der Responsetext ohne DOM-Kontext daherkommt? Ein kleines Beispiel:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>jQuery Tester</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <script type="text/javascript" src="jquery-1.5.1.min.js"></script>
    <script type="text/javascript">
    
    $(document).ready(function()
    {
        $.ajaxSetup(
        {
            // Disable caching of AJAX responses
            cache: false
        });

        $('div#main').load('load.php', function(r, s, x)
        {
            var me = $(this);
            
            // this
            me.find('input.term').attr('value', 'via this');
            
            console.log('~this');
            console.log(me.find('input.term'));
            console.log(me.find('input.term').context);
            
            // response
            $(r).find('input.term').each(function(i, e)
            {
                $(e).attr('value', 'via response');
                
                console.log('~response');
                console.log($(e));
                console.log($(e).context);
            });
        });    
    });
    
    </script>
</head>
<body>

<div id="main"></div>

</body>
</html>

So nun. Sobald der DOM ready ist, lade ich per AJAX Request das Dokument load.php in meinen div#main.
load.php gibt mir ein Formular zurück, in welchem ich ein input-feld mit der Klasse .term gesetzt habe. Ich würde dieses Formular nach dem Request gerne noch ein wenig verändern (per jQuery), namentlich einen autocomplete initialisieren.
Natürlich könnte ich auch per .live() einen Event auf diese noch nicht vorhandenen Elemente initialisieren, das ist allerdings nicht Gegenstand meiner Frage

Nun, wieso macht es Sinn, das in einer Callbackfunktion von .load() der Parameter response nicht das eigentliche DOM-Objekt ist, welches dem div#main hinzugefügt wurde, sondern nur ein Text, der sich selbst als Kontext hat?

she3p · Mrz 16, 2011

Hopla, kleineres Maleur. Richtig müsste das Beispiel wie folgt aussehen:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>jQuery Tester</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <script type="text/javascript" src="jquery-1.5.1.min.js"></script>
    <script type="text/javascript">
    
    $(document).ready(function()
    {
        $.ajaxSetup(
        {
            // Disable caching of AJAX responses
            cache: false
        });

        $('div#main').load('load.php', function(r, s, x)
        {
            var me = $(this);
            
            // this
            me.find('input.term').each(function(i, e)
            {
                $(e).attr('value', 'via this');
            
                console.log('~this');
                console.log($(e));
                console.log($(e).context);
            });
            
            // response
            $(r).find('input.term').each(function(i, e)
            {
                $(e).attr('value', 'via response');
                
                console.log('~response');
                console.log($(e));
                console.log($(e).context);
            });
        });    
    });
    
    </script>
</head>
<body>

<div id="main"></div>

</body>
</html>

Der Kontext ist nun bei beiden Objekten derselbe. Das heisst, es kann wohl nicht daran liegen. Die Frage allerdings bleibt. (Wenn auch ein wenig abgeändert.)
Wie lässt sich eine Callbackfunktion rechtfertigen, die als Response eine Kopie (ausserhalb des DOMs) liefert, die nichts (aber auch gar nichts) bringt?

jQuery vs. Callback

she3p

0

she3p

0