problèmes avec la méthode jQuery load()

Je ne fais que commencer avec jQuery, et j'ai du mal à faire quelque chose d'embarrassant: utiliser .load() pour insérer du HTML externe dans une page principale.problèmes avec la méthode jQuery load()

est ici la page principale:

<html> 
    <head> 
    <script src="js/jquery-latest.min.js" type="text/javascript" charset="utf-8"></script> 
    <script type="text/javascript" charset="utf-8"> 
     $(document).ready(function(){ 
      $(".log").ajaxError(function() { 
       $(this).text('Ajax error.'); 
      }); 

      $('.result').load('external.html', function() { 
       $('.log').text('Loaded.') 
      }); 
     }); 
    </script> 
    </head> 
    <body> 
     <div class="log"> 
     </div> 
     <div class="result"> 
     </div> 
    </body> 
</html>

Et voici external.html:

<p>Some external content!</p>

Quand j'ouvre cette page dans mon navigateur, "Loaded". est inséré dans le fichier .log div, mais le code HTML externe n'est pas inséré dans le fichier .result div. Aussi, même si je supprime external.html ou renommer le fichier, il dit toujours "Loaded". Si le fichier ne peut être trouvé, cela ne devrait-il pas être une erreur Ajax? Il ne semble pas que .load() saisisse les données.

Edit: Basé sur la suggestion de chrissr, j'ai changé le code: "Tout a bien fonctionné"

$(".result").load("external.html", function(response, status, xhr) { 
    if (status == "error") { 
    var msg = "Sorry but there was an error: "; 
    $(".log").html(msg + xhr.status + " " + xhr.statusText); 
    } else { 
    var msg = "Everything worked fine!"; 
    $(".log").html(msg); 
} 
});

Quand je lance cela, il insère dans le div div.

Édition 2: Je l'ai essayé dans Firefox, et ça marche! (J'utilisais Chrome avant). Je pensais que jQuery fonctionne avec Chrome, non?

Édition 3: Problème résolu! J'ouvrais le fichier localement (comme dans le fichier: //). Je pense que cela causait des problèmes de sécurité ou quelque chose. Quoi qu'il en soit, maintenant je sais que je dois d'abord le lancer sur mon serveur web si je veux tester en chrome.

Source

2010-06-23 Alex Miller

Utilisez l'extension FireBox FireBug pour examiner la requête AJAX en cours. Cela vous montrera la requête telle qu'elle se passe, les arguments et les en-têtes de la requête et le corps de la réponse et les en-têtes. Cela mettra en évidence où vous allez mal. –

Problème résolu! J'ouvrais le fichier localement (comme dans le fichier: //). Je pense que cela causait des problèmes de sécurité ou quelque chose. Quoi qu'il en soit, maintenant je sais que je dois d'abord le lancer sur mon serveur web si je veux tester en chrome.

Source

2010-07-06 18:33:45

Êtes-vous sûr que external.html est présent dans le même répertoire que cette page?

Source

2010-06-23 20:16:03 Dogbert

Oui, il est présent dans le même répertoire. –

Le rappel .load() sera exécuté indépendamment du succès ou de l'échec. Cela indique simplement que l'opération de chargement est terminée (avec ou sans succès).

Essayez quelque chose comme ça pour obtenir des détails:

$(".result").load("external.html", function(response, status, xhr) { 
    if (status == "error") { 
    var msg = "Sorry but there was an error: "; 
    $(".log").html(msg + xhr.status + " " + xhr.statusText); 
    } 
});

Je devine que vous êtes en cours d'exécution dans un problème avec le same origin policy ou que le chemin vers external.html est incorrect.

Source

2010-06-23 20:20:54 chrissr

Ah, cela expliquerait pourquoi il a imprimé "Loaded!" Cependant, j'ai copié et collé votre code, et aucun message d'erreur n'a été affiché. J'ai ensuite ajouté une instruction else, et il exécute le code dans l'instruction else, impliquant à nouveau qu'il n'y a pas d'erreur! –

J'ai copié vos fichiers HTML et référencé mon fichier local jQuery-1.4.1.min.js et cela a fonctionné correctement. Comme Adam l'a dit, vous devriez probablement vérifier si le chemin source du script et le chemin externe.html sont corrects.

Source

2010-06-23 20:30:20

Ces deux chemins sont corrects. D'autres trucs jQuery fonctionnent, donc je sais que mon chemin vers ça est correct. Et external.html se trouve dans le même répertoire que main.html. –

problèmes avec la méthode jQuery load()

Répondre

Questions connexes