11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'apprends a utliser jquery, mais je rencontres quelques problemes et j'ai besoin d'assistance.

Voici mon probleme:

J'ai une page html qui contient une div (id="primaryContentContainer)", dont le contenu et chargee en ajax.

Les liens qui sont utilises pour charger cette div on la structure suivante :

<a href="#" id="_dos622">Dos v6.22 boot disk</a>

Voici mon code jquery qui est utilise pour charger la div


$(document).ready(function() 
   { 
       $("a").filter("[@id^=_]").click(function()
          {
	      var lien=$(this).attr("id");
              lien=lien.substr(1,lien.length-1);
              lien=lien+'.html';

              $("#primaryContentContainer").fadeOut("slow",function()
                 {                                             
$("#primaryContentContainer").load("pages/utilswin32/"+lien ,function()
                       { 
                             $("#primaryContentContainer").fadeIn("slow") 
                       });
                 } );
          } );
   } );


Cela fonctionne bien, sauf dans le cas ou le lien est contenu dans une page chargee dans la div, dans ce cas, rien ne se passes.

J'ai essaie de mettre un alert dans ma fonction, mais rien ne se passes lorsque je clique sur un de ces liens.

On dirait que .click() ne fonctionne pas pour les pages chargees par .load()

Quelq'un peut m'aider?
Modifié par Krafton (23 Jun 2007 - 20:33)
Apres avoir cherche un peu dans le forums et les docs, voici ce que j'ai apris :

.click() ne peut lier les events qu'a des elements DOM connus, aussi comme je cree les events au moment ou la page est chargee, il ne peuvent s'appliquer a une partie de page chargee apres en ajax.

Il faut donc lors du chargement .load() regenerer les liens d'events dans la fonction callback.

Aussi, c pas une bonne idee d'utiliser les ids, etant donné qu'un id ne peut etre present qu'un seule fois.

J'ai donc pense a utilise l'attribut rel.

Voici comment j'ecris mes liens :

<a href="#" rel="_dos622">Dos v6.22 boot disk</a>

Voici mon code :


$(document).ready(function()
   {
	clicks();

} ); 

function clicks()
	{
		$("a").filter("[@rel^=_]").bind("click",function()
			{
				$("a").filter("[@rel^=_]").unbind("click");
	      			var lien=$(this).attr("rel");	
              			lien=lien.substr(1,lien.length-1);
              			lien=lien+'.html';
				$("#primaryContentContainer").fadeOut("slow",function()
                 			{                                             
						$("#primaryContentContainer").load("pages/utilswin32/"+lien ,function()
                       					{ 
                             					$("#primaryContentContainer").fadeIn("slow"),function ()
									{ clicks(); });
                       					});

                 			} );
          		} );
	}


De cette facon, je peux maintenant inclure des liens dans les pages chargee en ajax.

Peut-etre que ca peut aider quelqu'un...