jQuery：從選擇選項每頁的項目分頁？

我正在創建一個使用jquery的分頁，我希望允許用戶使用select下拉菜單選擇頁面上顯示的結果/項目的數量。jQuery：從選擇選項每頁的項目分頁？

我的分頁工作時沒有選擇選項，但當我涉及選擇選項部分。分頁停止工作，並且選擇選項部分也不工作。

我創造了這個的jsfiddle來解釋這個問題：在代碼 https://jsfiddle.net/q5rgLwb8/5/

當我改變了itemperPage = Itemoption;到itemperPage = 2;或itemperPage = *ANY NUMBER*;分頁再次開始工作上面。

我曾嘗試alert();Itemoption一旦選擇選項，它工作正常，我得到的警報框中的值，但我不明白爲什麼它不起作用，當我嘗試使用值我在上面的代碼中解釋的方式。

任何幫助，將不勝感激。

來源

2015-04-03 H.HISTORY

這應該工作。你可以試試嗎？

var countries = []; 
var per_page = 10; 
function generate_pagination(per_page) { 
    var pagination_links = countries.length/per_page; 
    var pagination_length = Math.ceil(pagination_links); 
    $('#pagination').html(''); 
    for (var i = 1; i <= pagination_length; i++) { 
     $('#pagination').append('<a href="#" class="page">' + i + '</a>'); 
    } 
} 

function display_countries(start, end) { 

    $('.new').html(''); 
    for (var i = 0; i < countries.length; i++) { 

     if (i >= start && i < end) { 
      $('.new').append('<tr><td>' + (i + 1) + ": " + countries[i] + '</td><td>Action</td></tr>'); 
     } 
    } 
} 

$(document).ready(function() { 
    $("#displayvalues").change(function() { 
     per_page = $(this).find("option:selected").val() 
     var end = 1 * per_page; 
     var start = 0; 
     display_countries(start, end); 
     generate_pagination(per_page); 
    }) 

    $('body').on('click', '.page', function() { 
     var page_no = $(this).html(); 
     var end = page_no * per_page; 
     var start = end - per_page; 
     display_countries(start, end); 
     return false; 
    }) 

    $.ajax({ 
     url: './countries.php', 
     type: 'GET', 
     data: { countries: true }, 
     cache: false, 
     async: true, 
     dataType: 'json', 
     success: function (data) { 
      countries = data.countries; 
      generate_pagination(per_page); 
      display_countries(0, per_page); 
     } 
    }); 
});

來源

2016-02-25 19:14:32

jQuery：從選擇選項每頁的項目分頁？

回答

相關問題