Retour de la fonction load

Version imprimable

16/11/2009, 16h49
Tristan Zwingelstein

Retour de la fonction load
Si je charge ce template html
Code:

1 2 3 4 <div> <p>bla</p> </div>
avec la fonction load de jquery :
Code:

1 2 $('monSelecteur').load('template');
J'aurai accès dans $('monSelecteur') qu'au premier niveau de l'arbre que j'ai chargé (ici une balise div).

J'en déduis que ce n'est pas un objet DOM qui est retourné par la fonction mais de l'html pur et dur.

Existe - t - il un moyen de récupérer tout le template sous forme d'objet tout de suite ?

merci
16/11/2009, 23h30
Invité

Bonjour,

Peux-tu être plus explicite quand à ta question et ce que tu veux faire?

load(fn), permet de déclencher une fonction après le chargement de l'élément cible et de son contenu. load() renvoit un objet jQuery permettant de faire du chaînage.

A+

Si je reprends mon exemple simplifié :

Code:

1
2
3
4
 
Mon template : 
 
<p>bla</p>

Code:

1
2
3
4
5
 
var test = $('<div/>');
test.load('monTemplate');
console.log($(test)); //j'ai le div
console.log($(test).children()); //pas de résultat alors que je devrais avoir le <p/>

Suis - je clair ?

merci

Re,

monTemplate est ta fonction ?
Es-tu sur qu'elle est effectivement déclenchée?

Voici un essai avec le chargement d'une image

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<head>
    <title>load(fn)</title>
    <style type="text/css">
    </style>
 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    var src = "http://www.paris.diplo.de/Vertretung/paris/fr/Startseite__Elemente/2009__Dossier__20__ans/Image__Porte__de__Brandebourg__bild,property=Galeriebild__gross.jpg";
    $(document).ready(function(){
 
        $('<div id="newDiv"><img src="' + src + '"/><p>le paragraphe</p></div>').appendTo($("#conteneur"));
        $("img").load(function(){
            console.log("C'est ok!");
            console.log($(this).parent());
            console.log($(this).siblings());
        });
    });
    </script>
</head>
<body>
    <div id="conteneur"></div>
 
</body>
</html>

Citation:
Envoyé par Tristan Zwingelstein
Si je reprends mon exemple simplifié :
Code:

1 2 3 4 Mon template : <p>bla</p>
Code:

1 2 3 4 5 var test = $('<div/>'); test.load('monTemplate'); console.log($(test)); console.log($(test).children());
Suis - je clair ?

merci
Salut,

load est un appel Ajax asynchrone, c'est à dire que le résultat n'est pas encore
arrivé lorsque tu fais tes console.log

Essaie ainsi:
Code:

1 2 3 4 5 var test = $('<div/>'); test.load('monTemplate', function() { console.log(test); //j'ai le div console.log(test.children()); //pas de résultat alors que je devrais avoir le <p/> });