11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

je vais essayer d'expliquer mon problème clairement !
J'ai un menu avec des liens vers mes pages php, et un script qui me permet de remplir une div avec ces pages sans actualiser la page courante. Et ça fonctionne bien, mais le problème c'est qu'il charge la page complète, avec le header, le background, etc...

Voici mon code :

$(document).ready(function(){ 	
   $("#menu_vert a").click(function(){ 	
	page=($(this).attr("href")); 
	$.ajax({  
		url: page, 
		cache: false, 
		success:function(html){ 
			afficher(html);	    
		},
		error:function(XMLHttpRequest, textStatus, errorThrows){ 
		}
	});
	return false; 
   });
});

function afficher(donnees){ 
	$("#content").empty();
	$("#content").append(donnees); 
}


J'ai essayé quelque chose du genre
 data: ({id : this.getAttribute('content')}), 
mais ça ne marche pas...
Je sais qu'une solution pourrait être de ne mettre que du contenu dans mes pages cibles (sans header ni gabarit etc), mais elles ne seraient alors plus accessibles directement, et je ne préfère pas (référencement, ergonomie..)

Je suis débutant alors veuillez pardonner mes erreurs Smiley biggrin
Et merci d'avance pour vos réponses !
Modifié par Suiko (27 May 2010 - 12:28)
Comme ceci :


$(document).ready(function(){      
   $("#menu_vert a").click(function(){      
    page=($(this).attr("href"));  
    $("#content").load(page+" #content"); 
    return false;  
   }); 
}); 
 
Merveilleux, ça marche ! Et en plus, le code est deux fois moins long...
Quel est la différence entre .load et .ajax, alors ?

Quoi qu'il en soit, je met le topic en résolu ! Merci encore !