Question

我的网站上有一个分页器，我需要添加一个按钮，允许显示所有结果而不分页。

对于分页，我有这个脚本：

jQuery(function() 
{
    var items = $("article.inmueble");
    var numItems = items.length;
    var perPage = 5;

    items.slice(perPage).hide();

    jQuery("#paginador").pagination({
        items: numItems,
        itemsOnPage: perPage,
        cssStyle: 'light-theme',
        onPageClick: function(pageNumber) { 
            var showFrom = perPage * (pageNumber - 1);
            var showTo = showFrom + perPage;

            items.hide() 
                 .slice(showFrom, showTo).show();
        }
    });
});

此代码位于js/initialize_paginator.js。

在我的index.php中，我称这个剧本为：

<script type="text/javascript" src="js/initialize_paginator.js"></script>

在这个index.php我有一个按钮：

<button class="btn btn-default btn-sm">Ver todo</button>

如何点击此按钮，将var perPage = 5;更改为（例如）var perPage = 999999999;以显示所有结果？

Answer 1

在jQuery（function（）

之外使用perPage作为全局变量

Answer 2

创建一个初始化分页的函数。像这样的东西

function paginate(items,numItems,perPage)
{
   items.slice(perPage).hide();

jQuery("#paginador").pagination({
    items: numItems,
    itemsOnPage: perPage,
    cssStyle: 'light-theme',
    onPageClick: function(pageNumber) { 
        var showFrom = perPage * (pageNumber - 1);
        var showTo = showFrom + perPage;

        items.hide() 
             .slice(showFrom, showTo).show();
    }
});
}

然后在需要时使用更新值paginate($("article.inmueble"), $("article.inmueble").length, 5);和重新初始化，就像在你的情况下使用perPage值9999的btn点击事件一样。

希望这有帮助。

在另一个文件中更改jQuery函数的var

2 个答案: