jquery добавление повторяющегося элемента

Question

Я работаю над некоторым разбиением на страницы ajax. Я использую следующий код:

jQuery(function($) { 
$('#content').on('click', '.woocommerce-pagination a', function(e){ 
    e.preventDefault(); 
    var link = $(this).attr('href'); 
    $('#content').fadeOut(200, function(){ 
     $(this).load(link + ' #content', function() { 

      $(this).fadeIn(200); 
      $('.products li').css("width","21.05%"); 
      $('#content').css("width","70%"); 
     }); 
    }); 
}); 
}); 

Это работает, как и должно быть, но по некоторым причинам он добавляет #content в пределах первоначального #content дел. Когда я смотрю источник, он выглядит так:

<div id="content" role="main" style="display: block; width: 70%;"> 
<div id="content" role="main"> 
</div> 
</div> 

Может ли кто-нибудь понять, в чем проблема?

Answer 1

Добавить обертку, лучше использовать ссылочные переменные, это мои правила большого пальца, чтобы избежать таких ошибок, которые могли бы действительно убить ваше время, если i t получить в вашей голове ....

Answer 2

$(this).load(link + ' #content'... 

Вы говорите, что груз все, что внутри http://...... #content в #content на сайте я нахожусь на. Вы можете добавить оболочку, содержащую контент, чтобы избежать такого поведения.

Answer 3

я думаю, что здесь проблема

$(this).load(link + ' #content', function() { 

я думаю, что вы загружаете #content из ссылки в #content на странице

это означает, что второй #content загружается из Привязать вы должны загрузить его содержимое