Jquery AJAX Load problem

Question

J'essaie de charger toutes les pages de mon site Web à l'aide de la méthode jQuery .load. Ainsi, mon site Web se présente comme suit:

<script type="text/javascript">  
  $(function() {
    $('.link').bind('click', function(e) {
            var page = $(this).attr('href');
            $('#site').addClass('loading');
            $('#content').load(page, function (){
            $('#site').removeClass('loading');
    });

    e.preventDefault();
    return false;
  });

<a href="test.php" class="link">Test</a>

Avec ce code, chaque lien qui obtient class = " link " va charger ma page sur le div #content. Fonctionne bien! Aucun problème, mais lorsque je charge le fichier test.php, si j'utilise la classe = " lien " sur n'importe quel lien, bouton ou quoi que ce soit, cela ne fonctionne tout simplement pas et la nouvelle page est chargée en dehors de mon # contenu.

Vous avez déjà essayé de copier ceci dans le nouveau fichier chargé et cela ne fonctionne pas, quelqu'un a un indice?

Merci

Answer 1

En effet, lorsque vous liez un événement, il ne le lie qu'aux éléments qui se trouvent dans le DOM à ce moment-là. Ainsi, si vous en ajoutez de nouveaux ultérieurement, ils ne seront pas liés à l'événement que vous avez précédemment associé. En supposant que vous avez jQuery 1.3, il a une fonction intégrée pour contourner ce que l’on appelle live . Avec celui-ci, vous pouvez lier un événement à tous les éléments actuels et futurs. Il ne prend pas en charge tous les événements, mais cliquez sur , il prend en charge.

Donc, gardez cela à l'esprit, il vous suffit de remplacer ceci:

$('.link').bind('click', function(e) {

Avec ceci:

$('a.link').live('click', function(e) {

(J'ai ajouté l'a. au sélecteur car il est beaucoup plus efficace de spécifier l'étiquette si possible)

Si vous n’avez pas jQuery 1.3, vous devriez mettre à jour le plus tôt possible. Si vous ne pouvez pas le faire, consultez le plug-in livequery qui permet d'atteindre le même objectif manière moins élégante. Alternativement, vous pouvez simplement avoir une fonction pour lier l’action et l’appeler chaque fois que vous chargez de nouvelles données. Tout bien considéré, cependant, le live de jQuery est le meilleur moyen de le faire.