Prise en compte de nouvelles divisions par des fonctions js
Bonjour à tous !
J'ai un script qui ne marche pas, et j'ai une petite idée du problème (peut-être fausse) et je ne sais pas comment la régler.
Voici l'idée globale : je suis sur une page, j'ai une division #contenu qui contient... eh bien, le contenu ^^.
Pour charger ce contenu, j'ai une barre de lien possédant la class .CHARGE, et finalement, j'ai un code js avec une fonction de chargement. Le code global est trop lourd pour être mis ici, mais en simplifié ça donne ça :
Html :
Code:
1
2
3
4
5
6
| <div name="navbar">
<a href="#" class="CHARGE" direction = "page_1">Page 1</a>
<a href="#" class="CHARGE" direction = "page_2">Page 2</a>
<a href="#" class="CHARGE" direction = "page_3">Page 3</a>
</div>
<div id="contenu"></div> |
Js :
Code:
1
2
3
4
| $('.CHARGE').click(function() {
var pageacharger = $(this);
$('#contenu').load("www/"+pageacharger.attr('direction')+".html");
}); |
Le script fonctionne à merveille et charge mes pages sans problème. CEPENDANT, le liens placé dans les pages ne déclenche pas le script (si par exemple dans page_1.html j'ai le code
Code:
<a href="#" class="CHARGE" direction = "page_2">Plus d'info en page 2</a>
, il ne déclenche rien du tout.
Mon idée : au moment de la déclaration de mon js, le lien placé dans page 2 n'est pas encore chargé, et donc le sélecteur de classe ne l'identifie pas. Donc cliquer sur le lien ne charge que dalle dans contenu.
Comment faire en sorte que la fonctions de charge prennent en compte les liens chargés après le chargement de la page ? Rédéclarer la fonction de charge à la fin de chaque chargement dans #contenu suffit-il ? N'existe pas quelque chose de plus optimal ?
Ou l'erreur se situe-t-elle ailleurs ?
Messieurs, merci pour vos idées et vos suggestions =)
