0

我有一个来自 Twitter Bootstrap 的流体.html 示例 - 左侧的导航列表是过去几个小时让我头疼的原因。我需要做这些事情中的一个或两个：

  1. 过滤导航列表 - 或多或少这样做： http: //kilianvalkhof.com/2010/javascript/how-to-build-a-fast-simple-list-filter-with-jquery/ - 虽然它工作得很好在这个网站上，我无法让它在不破坏其外观的情况下过滤 Bootstrap 的导航列表中的元素。

  2. 通过单击其中一个元素来切换所有<li>s 直到下一个。所以如果我有：<li class="nav-header"><li class="nav-header">

    • 第一类
      • 链接 1
      • 链接 2
      • 链接 3
    • 第 2 类
      • 链接 4
      • 链接 5
      • 链接 6

...单击类别 1 应切换链接 1、2 和 3，单击类别 2 应仅切换链接 4、5 和 6。我试过 jQuery Collapse 插件，但它破坏了导航列表样式。我还尝试在s 之间切换<div>所有s - 但它也打破了导航列表样式。我有一个想法，用相同的 id 切换所有s，但我不知道如何使用 jQuery 或纯 JavaScript 来做到这一点。<li><li class="nav-header"><li>

知道如何做这些事情中的一个或两个吗？提前致谢。

4

2 回答 2

0

只需检查是否有 child <ul>，然后在单击时使用 jQuery 切换它。

<script>
    $('li').on('click', function() {
        $(this).children('ul').toggle();
    });
</script>
于 2012-09-21T18:18:11.843 回答
0

好的，我终于用 jQuery 和第一个示例修复了列表过滤。问题是，jQuery 是在文档末尾加载的，而脚本要求它在表单之前加载。所以，工作:)

于 2012-09-21T19:59:02.483 回答