Question

我的HTML目前只生成一个页面。根据选择的“产品”，我想使用javascript插入的“多页”功能。

以下是一些示例代码：

<div id="products">

  <div id="product-1" class="product">
    <a href="/product/marco" title="View marco" class="product-a">
      <span class="stilt"></span>
      <div class="product-info"><h3 class="product-title"><span>marco</span></h3><p class="product-price"><span><span class="currency_sign">€</span>23.00</span></p></div>
    </a>
  </div>

  <div id="product-2" class="product">
    <a href="/product/la-regola-dell-amico" title="View la regola dell'amico" class="product-a">
      <span class="stilt"></span>
      <div class="product-info"><h3 class="product-title"><span>la regola dell'amico</span></h3><p class="product-price"><span><span class="currency_sign">€</span>22.00</span></p></div>
    </a>
  </div>
.
.
.
</div>

例如，我想将“products”div拆分为内部div的多个页面，例如id为“product-9”。我怎么做？

修改可能不太清楚，我有很多产品，我想每页显示9个产品

Answer 1

Here is a VERY basic example using jQuery

症结在这里：

function togglePage(page)
{
    for (var i = 1 ; i < pageSize  + 1; i++)
    {
        $("#product-" + ((page * pageSize) + i)).toggle();

    }
}

您可以使用更复杂的选择器以更少的代码执行此操作，但我已经让非jQuery用户能够轻松阅读。

基本上，我根据页面大小计算每次显示的项目。为简单起见，我将其限制为两个。 CSS有display：none默认隐藏它。

页码没有上限检查，但创建一些页面并不是非常困难。

使用JavaScript的多个页面

1 个答案: