分页表通过选择选项显示 TR答案

【问题标题】：Pagination table show TR by select option分页表通过选择选项显示 TR
【发布时间】：2015-06-24 14:40:46
【问题描述】：

对于基本的分页，我使用这个脚本。

$('table.paginated').each(function() {
var currentPage = 0;
var numPerPage = 5;
var $table = $(this);
$table.bind('repaginate', function() {
    $table.find('tbody tr').hide().slice(currentPage * numPerPage, (currentPage + 1) * numPerPage).show();
});
$table.trigger('repaginate');
var numRows = $table.find('tbody tr').length;
var numPages = Math.ceil(numRows / numPerPage);
var $pager = $('<div class="pager"></div>');
for (var page = 0; page < numPages; page++) {
    $('<span class="page-number"></span>').text(page + 1).bind('click', {
        newPage: page
    }, function(event) {
        currentPage = event.data['newPage'];
        $table.trigger('repaginate');
        $(this).addClass('active').siblings().removeClass('active');
    }).appendTo($pager).addClass('clickable');
}
$pager.insertBefore($table).find('span.page-number:first').addClass('active');
});

完美运行。但我想从选择中使用设置“numPerPage”的解决方案。我添加了选择表单数组。这在分页脚本之前仍然很简单。

// Create selection from Array
    var arr = [
        {val : 1000, text: 'All'},
        {val : 5, text: '5'},
        {val : 10, text: '10'},
        {val : 15, text: '15'},
        {val : 20, text: '20'}
    ];

    var sel = $('<select id="selectionPerPage">').appendTo('#selection');
    $(arr).each(function() {
        sel.append($("<option>").attr('value',this.val).text(this.text));
    });

然后我添加了选择更改功能。

  // Set value after selection
    $('#selectionPerPage').change(function() {
        // value and cookie
        var numPerPage = $(this).val();
    });

如果我在选择中更改值，我需要找到通过“numPerPage”值显示 TR 的解决方案。

FIDDLE 中的整个脚本http://jsfiddle.net/skyndas/hv979kn6/15/

【问题讨论】：

标签： jquery html pagination

【解决方案1】：

检查这个 jsfiddle，我为你工作。

jsfiddle : http://jsfiddle.net/vasantharaj/hv979kn6/24/

【讨论】：