wordpressでAJAXで次ページを読み込む「jQuery.autopager」
まずは、jQuery.autopagerをダウンロード。
基本的には
<script type="text/JavaScript">
$(function(){
$.autopager({
content : '.content', // ロードしたいコンテンツ部分のセレクタ
link : '#next' // 次ページへのリンクのセレクタ
});
});
</script>
ボタンで読み込むには
<script type="text/JavaScript">
$(function(){
$.autopager({
content : '.content', // ロードしたいコンテンツ部分のセレクタ
link : '#next', // 次ページへのリンクのセレクタ
autoLoad: false, // スクロールで自動読込みするどうか
load : function(){ // 読み込み完了後に発生するイベント
// "this"は読み込んだコンテンツ要素を指す
$(this).before('<hr/>'); // 左記は例(読み込んだヤツの前に区切り線を追加))
}
});
$('#next').click(function(){ // 次ページへのリンクボタンが押されたら
$.autopager('load'); // loadしやがれぃ!
return false;
});
});
</script>
さらに、最後読み込んだ後ボタンを消すにはload部分を下記に変える
load: function(current, next){
if( current.page >= max_num_pages; ?> ){
$(‘#next’).hide();
}
}