Chargement d'un fichier .htm externe dans un div avec javascript

Je ne suis pas un codeur de toute sorte, et je sais qu'il existe plus d'une façon de faire fonctionner.
C'est ce qui m'a fonctionné pour ma situation.
J'avais un site de travail mais avec beaucoup de code / contenu DIV en une seule page et je voulais nettoyer ça.
J'espère que ça aidera quelqu'un d'autre!

J'ai été à la recherche de cette solution depuis un certain temps et j'ai rencontré de nombreux exemples de la façon dont cela peut fonctionner dans différents cas. Mon scénario était le suivant:
J'ai un site Web de photographie qui utilise une série de balises DIV contenant les différentes "pages" pour ainsi dire sur le site.
Celles-ci étaient toutes définies comme suit:
<div id="DivId" style="display:none"></div>
Le script suivant dans la tête de la page:

    
     $ (Document) .ready (function () {
     $ ('A'). Cliquez (function () {
     Var divname = this.name;
     $ ("#" + Divname) .show ("slow"). Frères et sœurs (). Hide ("slow");
     }); 

 }); </script> 

Et appelé à utiliser les liens d'ancrage comme ceci:
<a href="" name="home">HOME</a>
Où le nom était le nom du DIV à appeler.
Veuillez noter que le DIV sera appelé dans le conteneur parent DIV.
Enfin et surtout pour cette question et scénario particulier, le DIV a été placé sur la page comme indiqué ci-dessus.
Chaque contenu div a été créé comme s'il s'agissait d'une étiquette DIV mais moins les étiquettes DIV d'ouverture et de fermeture, puis sauvegardées sous la forme d'un fichier .txt séparé, et appelé en plaçant ceci est la tête de la page parentale:
src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js">
et

    
     $ (Document) .ready (function () {// cela s'exécute dès que la page est prête (DOM est chargé)
         $ ("# DivName") // sélectionnant "div" (vous pouvez également sélectionner l'élément par son identifiant ou classe comme dans css)
         .load ("PathToFile.txt"); // charger dans le fichier spécifié
         $ ("# AnotherDiv"). Load ("AnotherFile.txt"); // Un DIV supplémentaire peut être ajouté pour remplir les DIV sur la page par eparent.
     });
    

Changez le lien vers href="#" ou "javascript:void(0);return false;"

 <a class='ajax' href='#'>...</a> 

La logique de chargement est tout dans votre appel ajax. Mais, vous avez également un lien qui indique le fichier. Ainsi, il semble que certains navigateurs donnent différentes priorités sur la façon dont le clic est traité.

Quoi qu'il en soit, les liens qui font autre chose que la modification de la page (par exemple, l'exécution de js) ne devraient pas avoir d'attribut HREF explicite autre chose que "ne rien faire" (comme ci-dessus)

Je crois que le problème est que le script fonctionne avant que le document ne soit chargé.

essaye ça:

 $(document).ready(function (){ $('.ajax').click(function(e){ e.preventDefault() $('#content').load( 'file.htm' ) }); }); 

Je ne suis pas sûr, mais je ne vois pas d'autre problème.