jQuery 無刷新分頁實例代碼

更新時間：2013年11月12日 16:40:54 作者：

這篇文章介紹了jQuery 無刷新分頁實例代碼，有需要的朋友可以參考一下

<html>

var feedback = "";

                    $.each(data.list, function(index, d) {
                        var str ="";
                        str+= "<dl class='result' style='display:none;'>";
                        str+="<dt><img src='http://www.dhdzp.com/headshotsByName/balijiang.png?l' alt='圖片' width='70' height='70' /></dt>";
                        str+="<dd><a href='#' title='VYyu'>VYyu</a></dd>";
                        str+="<dd class='gray'>2009-09-26 </dd>";
                        str+="<dd>"+d+"</dd>";
                        str+="</dl>";
                        feedback += str;
                        });
                    $("#feedback").empty().append(feedback); //裝載對應(yīng)分頁的內(nèi)容

                    //alert(datac.list.length);
                    //var num_entries = $(".result").length;
                    var num_entries = data.list.length;
                    // 創(chuàng)建分頁
                    $("#page").pagination(num_entries, {
                        num_edge_entries: 1, //邊緣頁數(shù)
                        num_display_entries: 5, //主體頁數(shù)
                        callback: pageselectCallback,
                        items_per_page: 3, //每頁顯示1項
                        prev_text: "前一頁",
                        next_text: "后一頁"
                    });

pageselectCallback(0);
}

function pageselectCallback(page_index, jq){

    var resultList = $(".result");
    //var feedback = "";
    //alert(resultList.length);
    $(".result").each( function(index, data) {
            //alert(index);
            $(this).css('display','none');
            if(Math.floor(index/3) == page_index){
            $(this).css('display','block');
            }
            });

return false;
}
//ajax加載
$.getJSON("testPage",null, function(data){initPagination(data)});
});
</script>

</head>

<body>

</html>

您可能感興趣的文章:

相關(guān)文章

用Jquery實現(xiàn)可編輯表格并用AJAX提交到服務(wù)器修改數(shù)據(jù)
使用Jquery實現(xiàn)可編輯的表格并使用AJAX提交到服務(wù)器修改數(shù)據(jù)的實現(xiàn)代碼。
2009-12-12
jQuery實現(xiàn)獲取綁定自定義事件元素的方法
這篇文章主要介紹了jQuery實現(xiàn)獲取綁定自定義事件元素的方法,涉及jQuery方法重載、事件綁定及元素操作的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下
2015-12-12
jquery.serialize() 函數(shù)語法及簡單實例
下面小編就為大家?guī)硪黄猨query.serialize() 函數(shù)語法及簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-07-07
jquery獲取css中的選擇器(實例講解)
這篇文章主要是對使用jquery獲取css中選擇器的方法進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對大家有所幫助
2013-12-12
jQuery分頁插件jquery.pagination.js使用方法解析
這篇文章主要為大家詳細(xì)解析了jQuery分頁插件jquery.pagination使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-02-02
jQuery之過濾元素操作小結(jié)
這篇文章主要介紹了jQuery中的過濾元素操作。需要的朋友可以過來參考下，希望對大家有所幫助
2013-11-11
jQuery實現(xiàn)彈出窗口彈出div層的實例代碼
這篇文章主要介紹了jQuery實現(xiàn)彈出窗口彈出div層的實例代碼,點擊頁面的鏈接，彈出一個div層，同時頁面的其他部分變灰并且不能點擊,，具體實現(xiàn)代碼大家參考下本文吧
2017-01-01
jQuery插件FusionCharts繪制的3D餅狀圖效果實例【附demo源碼下載】
這篇文章主要介紹了jQuery插件FusionCharts繪制的3D餅狀圖效果,結(jié)合完整實例形式分析了基于FusionCharts圖形插件繪制餅狀圖的操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2017-03-03
jQuery模擬Marquee實現(xiàn)無縫滾動效果完整實例
這篇文章主要介紹了jQuery模擬Marquee實現(xiàn)無縫滾動效果,結(jié)合完整實例形式分析了jQuery針對圖片與文字的無縫滾動效果實現(xiàn)技巧,需要的朋友可以參考下
2016-09-09
jQuery中height()方法用法實例
這篇文章主要介紹了jQuery中height()方法用法,以實例形式較為詳細(xì)分析了height()方法返回元素高度的用法與相關(guān)注意事項,具有一定的參考借鑒價值,需要的朋友可以參考下
2014-12-12