Bootstrap 导航标签“显示”不起作用？

Question

我正在尝试在词汇表中添加搜索框，但有些问题。该词汇表由 ul inside ul (nav-tabs of bootstrap )` 制作的，在 js 中我使用以下代码：

\n\n

$j(\'#search_glossary\').focus().keyup(function(e){\nif (this.value.length >= 2){\n\n$j(\'.nav-tabs li.active\').removeClass(\'active\');\n        $j(\'.tab-content div.active\').removeClass(\'active\');\n        var filterBy = this.value.toUpperCase();\n        for (var abbr in UlTab) {\nif (abbr.toUpperCase().indexOf(filterBy) !== - 1) {\nvar li = abbr;\n        var ulTabli = UlTab[abbr];\n        var globalUl;\n        if (/tv/.test(ulTabli)) globalUl = "tv";\n        if (/video/.test(ulTabli)) globalUl = "video";\n        if (/audio/.test(ulTabli)) globalUl = "audio";\n        $j(\'ul#\' + ulTabli + \' li a\').show();\n        $j(\'ul#\' + ulTabli + \' li a:eq(\' + li + \')\').show();\n        $j(\'#\' + ulTabli + \' a[href="#\' + li + \'"]\').tab(\'show\');\n        $j(\'#glossaryTab a[href="#\' + globalUl + \'"]\').tab(\'show\');\n        break;\n}\n\n$j(\'.nav-tabs li.active\').removeClass(\'active\');\n        $j(\'.tab-content div.active\').removeClass(\'active\');\n}\n});\n

\n\n

HTML 的结构如下：

\n\n

<ul id="glossaryTab" class="nav nav-tabs nav-justified">\n    <li><a href="#video" data-toggle="tab">video</a></li>\n    <li><a href="#audio" data-toggle="tab">audio</a></li>\n    <li><a href="#tv" data-toggle="tab">tv</a></li>\n</ul>\n<div id="glossary_content" class="tab-content">\n    <div class="tab-pane fade" id="video">\n        <ul id="videoTab" class="nav nav-pills">\n            <li>...</li>\n            <li>...</li>\n        </ul>\n        <div class="tab-content">\n            <div class="tab-pane glossary" id="...">...</div>\n            ....\n        </div>\n

\n\n

我有两个问题：

\n\n

\n

1. 有时搜索不会显示任何内容，当我键入 时检查调试控制台时$j(\'#audioTab a[href="#MP3"]\').tab(\'show\')，我发现它仅在未设置[<a href=\xe2\x80\x8b"#MP3" data-toggle=\xe2\x80\x8b"tab" style=\xe2\x80\x8b"display:\xe2\x80\x8b block;\xe2\x80\x8b">\xe2\x80\x8bMP3\xe2\x80\x8b</a>\xe2\x80\x8b]时显示 div 。style

\n

2. 当我搜索带有空白空间或具有 \'/\' 的内容时$j(\'ul#\'+ulTabli+\' li a:eq(\'+li+\')\').show();不起作用。

\n

\n\n

编辑：\n演示

\n

Answer 1

显然我忘记删除li第二个 ul 中的活动（大的里面的那个）

$('.tab-pane ul li.active').removeClass('active');