Question

我有一个记录集循环创建一个表，每9个项目包围一个div，所以基本上看起来像：

<div>
<table>rs1, rs2 ----> rs9</table>
</div>
<div>
<table>rs10, rs11 ----> rs18</table>
</div>

etc...

现在，我想要它，所以起初只有第一个div显示而其他的是隐藏的，但我有ASP循环，为各种div（页面）生成可点击的链接，点击任何给定的链接将显示div和隐藏所有其他人。

这是我到目前为止的asp代码：

Dim i
  If totalPages > 1 Then
    Response.Write("<div id='navigation'>")
  For i=1 to totalPages
      Response.Write ("<a href='' onlick=''>"& i &"</a> | ")
  Next
  Response.Write("</div>")
  End If

现在我只需要找出javascript ...

Answer 1

为了使这更容易，你应该以某种方式识别你的表。为它们提供一个标识特定结果集的ID和一个标识所有结果集的类名：

<table id="resultset-1" class="resultset"> ...

然后，您可以将事件绑定到导航元素中的链接：

window.onload = function() {
    document
        .getElementById('navigation')
        .getElementByTagName('a')
        .onclick = function() {
            var id = parseInt(this.innerHTML, 10);
            document.getElementsByClassName('resultset').style.display = 'none';
            document.getElementById('resultset-'+id).style.display = 'block';
            return false;
        }
}

我没有测试过这个，我的香草JS技能有点生疏，但它应该符合我的理解。只是为了踢，这是一个使用jQuery的版本，我可以保证工作：

$(function() {
    $('#navigation a').click(function() {
        var id = parseInt($(this).html(), 10);
        $('.resultset').hide();
        $('#resultset-'+id).show();
        return false;
    });
});

请记住最初以某种方式隐藏除第一个div之外的所有内容 - 您不需要使用JS，例如，您可以使用ASP将style="display: none;"打印到要隐藏的所有表中。

使用div和Javascript进行动态分页

1 个答案: