的jQuery分頁與WordPress

我試圖讓當分頁是有針對性的div外面的jQuery加載WordPress的分頁（類=「博客卷」）時，分頁是div（類中的jQuery分頁與WordPress

此功能= 「blog-roll」），但只要我把它拉出來，jQuery停止工作，當我使用分頁時，頁面跳轉。

這裏是我的代碼...

<div class="blog-roll"> 
    <wp_query set to global> 
</div> 

<div class="pagination"> 
    <wp pagination> 
</div> 

<script> 
jQuery(function($) { 
    $('.blog-roll').on('click', '.pagination a', function(e){ 
    e.preventDefault(); 
    var link = $(this).attr('href'); 
    $('.blog-roll').fadeOut(200, function(){ 
    $(this).load(link + ' .blog-roll', function() { 
    $(this).fadeIn(200); 
     }); 
     }); 
    }); 
    }); 
</script>

我認爲它有事情做與$（本），但即使當我將其更改爲$（「博客」）還不行工作。該腳本看起來像應該工作，因爲它是針對正確的項目。無論如何，任何幫助將不勝感激。

來源

2014-05-08 phlipinmi

您原來的分頁是內部「.pagination」，然後你正在做的事情爲‘拉出來’？我製作了一個JSFiddle。請儘可能接近原始地進行編輯：http://jsfiddle.net/Lzbgq/ – dschu

就是這樣！當分頁div和鏈接位於blog-roll divs中時，它就會工作，當它們在div之外時，就像你在jsfiddle中那樣失效。 WP分頁工作，但我得到頁面跳轉，而不是過渡。 – phlipinmi

是的，但你如何複製按鈕？如果使用.clone（）來完成，請嘗試使用.clone（true）來複制偵聽器。 – dschu

這個怎麼樣。我的分頁也在內容div之外，所以我也加載，以便當前頁碼得到更新。

<div class="blog">  
    <div class="blog-roll"> 
     <wp_query set to global> 
    </div> 

    <div class="pagination"> 
     <wp pagination> 
    </div> 
</div> 

<script> 
    $('.blog').on('click', '.pagination a', function(e){ 
     e.preventDefault(); 
     var link = $(this).attr('href'); 
     $('.pagination').load(link + ' .pagination'); //load and update your pagination as well since its outside blog-roll 
     $('.blog-roll').animate({ opacity: 0.1 },500, function(){ //opacity prevents page jump 
      $(this).load(link + ' .blog-roll', function() { 
       $(this).animate({ opacity: 1 },500); 
       $("html, body").animate({ 
         scrollTop: $(this).offset().top - 300 }, 400); //I added this in my code since I have pagination at the bottom of 20 posts 
      }); 
     }); 
    }); 
</script>

DEMO

來源

2014-05-08 22:02:28 shubhra

這爲我工作，謝謝！ – phlipinmi

的jQuery分頁與WordPress

回答

相關問題