Lib:jquery / ciblage d’id / lien

Bonjour,
J’ai un petit souci à cause du ciblage d’id avec le Protocol ajax.
(J’utilise la libraire jquery 1.3.2)
Mon but : faire apparaitre le contenu d’une page avec des liens (de manière asynchrone « ajax ») et et que ces même liens puisse être utilisé aussi.
Voila dans mon fichier index.php
Code JS

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<script src="template/js/jquery-1.3.2.min.js" type="text/javascript"></script> <script type="text/javascript"> <!-- $(document).ready(function() { $("#ajout").click(function () { $("#boite_g").load("manager/import.php");});//chagement du menu choix <!--fonction d'ajout du texte--> $("#ajout_texte").click(function () { alert("plop!"); }); }); //--> </script>

---

Code HTML

Code:

---

1 2 3 4

<a href="#ajout_modul" id="ajout" class="button"><span class="add">Ajout d'un module</span></a> <div id="boite_g"> </div> <a href="#" id="ajout_texte" class="button"><span class="new_texte">Nouveaux texte</span></a>

---

Voila le fichier import.php
Code HTML

Code:

---

1 2 3 4 5 6 7 8

<table border="0" cellspacing="1" cellpadding="0"> <tr> <td width="100px"><a href="#" id="ajout_texte" class="button"><span class="new_texte">Nouveaux texte</span></a></td> <td width="100px"><a href="#" class="button"><span class="new_tableau">Nouveaux tableau</span></a></td> <td width="100px"><a href="#" class="button"><span class="new_gi">Nouvelle Gestion d'image</span></a> </td> </tr> </table>

---

Mon problème c’est que le message « plop » produit par l’alerte (« plop ») ne fonctionne pas dans les lien charger de manière asynchrone mais marche avec le lien déjà charger.
Je voudrais bien savoir si c’est possible que les lien charger de manière asynchrone puisse interagiravec le code js déjà établie sur la page et si oui comment faire .
Merci d’avance pour votre aide
Cordialement
vincent

Salut,

Sujet maintes fois traité :roll:
:recherch:

Et un petit lien vers la FAQ

Merci de ta réponse ;)
Dls d’avoir posé une question inutile^^ et minentes fois traité ^^ mais cependant je ne vois pas bien comment faire et dans la recherche je n’est rien trouver (en se qui concerne une adaptation a jquery).
J’ai fait ceci mais ça ne marche pas je ne dois pas bien m'y prendre :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<!-- $(document).ready(function() { $("#ajout").click(function () { $("#boite_g").load("manager/choix.php");});//chagement du menu choix <!--fonction d'ajout du texte--> xhr.onreadystatechange = function(){ if(xhr.readyState == 4 && xhr.status == 200){ document.getElementById('ajout_texte').innerHTML = xhr.responseText; afterAjax();}} $("#ajout_texte").click(function () { alert("plop!"); }); });

---

petit up voila le code :
je ne voix pas trop comment déclarer la fonction afterAjax(); :?

voila ce que j'ai tenté mais sans conviction .... d'ailleurs ça ne marche pas ^^

Code:

---

1 2 3 4 5 6 7 8 9 10 11

$(document).ready(function() { $("#ajout").click(function () { $("#boite_g").load("manager/choix.php");});//chagement du menu choix <!--fonction d'ajout du texte--> $("#ajout_texte").click(function () { alert("plop!"); afterAjax(); }); });

---

Si quelqu'un à une idée

Le problème, c'est que $('#ajout_texte').click( ... ) n'affecte que les éléments existants, et pas aux éléments créés par la suite (via ton load).
Je vois 2 solutions :
- soit tu réaffectes les évènements après le chargement de choix.php

Code:

---

1 2 3 4 5 6

$('#boite_g').load('manager/choix.php', function(){ // code exécuté une fois le chargement effectué $('#ajout_texte').click(function(){ alert('plop'); }); })

---

- soit mieux, utiliser la fonction live, dispo depuis jQuery 1.3, qui affecte les éléments existants ET ceux créés après.

Code:

---

1 2 3

$('#ajout_texte').live('click', function(){ alert('plop'); })

---

Si ta fonction doit etre lancée apres l'exécution de ta requete Ajax, il te faut la mettre en "callback" de ta requete:

Code:

---

1 2 3 4 5 6 7 8 9

$(document).ready(function(){ $("#ajout").click(function () { $("#boite_g").load("manager/choix.php","",function () { alert("plop!"); afterAjax(); }); }); });

---

:ave::ave::ave: merci beaucoup pour vaux réponses ça marche nikel :ccool:

et hop résolu :)