[英]jQuery Pagination Plugin
希望這是一個容易補救的東西。 我在理解jQuery Pagination插件時遇到了一些問題。
基本上,我要做的就是加載一個PHP文件,然后對結果進行分頁。 我試圖擺脫他們的榜樣,但我並沒有屈服於我正在尋找的結果。
這是JavaScript:
function pageselectCallback(page_index, jq){
var new_content = $('#hiddenresult div.result:eq('+page_index+')').clone();
$('#Searchresult').empty().append(new_content);
return false;
}
function initPagination() {
var num_entries = $('#hiddenresult div.result').length;
// Create pagination element
$("#Pagination").pagination(num_entries, {
num_edge_entries: 2,
num_display_entries: 8,
callback: pageselectCallback,
items_per_page:3
});
}
$(document).ready(function(){
$('#hiddenresult').load('load.php', null, initPagination);
});
這是我的HTML(加載PHP之后):
<div id="Pagination" class="pagination"> </div>
<br style="clear:both;" />
<div id="Searchresult"> </div>
<div id="hiddenresult" style="display:none;">
<div class="result">Result #1</div>
<div class="result">Result #2</div>
<div class="result">Result #3</div>
<div class="result">Result #4</div>
<div class="result">Result #5</div>
<div class="result">Result #6</div>
<div class="result">Result #7</div>
</div>
基本上,我試圖每頁顯示“3”項,但這不起作用。 我假設在某個地方,我將需要在我的JS中創建一個for循環,但我很困惑如何這樣做。 文檔可以在這里找到 。
你甚至不需要使用for循環,只需使用jQuery的slice()
方法和一些數學運算。
我在JS Bin上主持了一個工作演示: http : //jsbin.com/upuwe (可編輯自http://jsbin.com/upuwe/edit )
這是修改后的代碼:
var pagination_options = {
num_edge_entries: 2,
num_display_entries: 8,
callback: pageselectCallback,
items_per_page:3
}
function pageselectCallback(page_index, jq){
var items_per_page = pagination_options.items_per_page;
var offset = page_index * items_per_page;
var new_content = $('#hiddenresult div.result').slice(offset, offset + items_per_page).clone();
$('#Searchresult').empty().append(new_content);
return false;
}
function initPagination() {
var num_entries = $('#hiddenresult div.result').length;
// Create pagination element
$("#Pagination").pagination(num_entries, pagination_options);
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.