Question

我正在使用x-cart网站，我有一个问题，如何在主页上为特色产品添加分页？我想要它的过程，如果用户点击下一个按钮，它将显示其他特色产品（在这种情况下，它仍然保留在主页上）。有可能吗？

我很快就会等你的回答。

Answer 1

这取决于您的模板，但我们假设您的精选产品以这种方式显示：

<div id="products">
    <div class="product-item product-item-odd">...</div>
    <div class="product-item product-item-even">...</div>
    <div class="product-item product-item-odd">...</div>
    <div class="product-item product-item-even">...</div>
    ...
</div>

你可以使用jQuery（可能在x-Cart中很老）来分页：

function paginate(container, max) {
    var items = container.children();
    var totalItems = items.length;
    var totalPages = Math.ceil(totalItems / max);
    var pager = $('<p class="my_pager"></p>');
    for (p = 1; p <= totalPages; p++) {
        pager.append('<span class="open_page">' + p + '</span>');
        items.slice((p - 1) * max, p * max).attr('data-page', p);
    };
    container.after(pager);
    $('.open_page').click(function (e) {
        $('.open_page').removeClass('active');
        $(this).addClass('active');
        var pageToOpen = $(this).text();
        items.hide();
        items.filter('[data-page=' + pageToOpen + ']').show();
    });
    $('.open_page:first').click();
};
paginate($('#products'), 2);

Fiddle example

在主页上的精选产品添加分页（X-Cart）

1 个答案: