0

我有当前生成单个页面的 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">€&lt;/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">€&lt;/span>22.00</span></p></div>
    </a>
  </div>
.
.
.
</div>

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

编辑 可能不清楚，我有很多产品，我想每页显示 9 个产品

4

1 回答 1

0

这是一个使用 jQuery 的非常基本的示例

症结在这里：

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

    }
}

您可以使用更复杂的选择器以更少的代码执行此操作，但我保持简单，以便非 jQuery 用户能够阅读。

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

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

于 2013-01-28T13:40:51.597 回答