我有一个标签列表（使用 jquery-ui 的 ul），我在整个页面上横向拉伸。在主题/选项卡区域的右上角（不在选项卡区域之外，而是在其中）我想要另一组我想要不同主题的导航。
所以我制作了另一个 ul 并将其嵌套在我父 ul 的最后一个 li 中。然后应用 css 覆盖应用于其余选项卡的 jquery-ui 主题。这有效，除了两件事：1.）我希望这个嵌套列表和我的标签条中的最后一个真实标签之间的间隙随着浏览器改变大小而缩小，如果它需要换行到底部（就像其余的一样标签可以）。2.) 我的嵌套 ul 中的第一个 li 被视为仍然是一个选项卡，因此当我单击它时，它不是指向我在href 属性，jquery-ui 推入“#ui-tabs-1”并尝试回发到当前页面上不存在的锚点。我不知道“#ui-tabs-1”是从哪里来的，因为那是 甚至不是我对父级 ul/tab-list 的命名约定？？？我没有将任何嵌套列表视为选项卡列表的一部分。
如果我需要取消嵌套另一个 ul 并将其放在页面上的其他位置，这对我来说很好......但是，我仍然希望它位于我的标签列表的右上角并且我希望它用标签包裹，所以这就是为什么我把它推到我父母 ul 的最后/最右边的 li 中。
有没有办法告诉 jquery“不要把这个 li 当作一个标签”？
我页面上的代码如下所示：
<article>
<div id="tabs">
<nav>
<ul>
<li><a href="#Parts" onclick="getTab('Parts');">Parts</a></li>
<li><a href="#Categories" onclick="getTab('Categories');">Categories</a></li>
<li><a href="#Links" onclick="getTab('Links');">Links</a></li>
<li class="untabbed">
<ul>
<li>[ <a href="/Store/Admin">Admin</a> |</li>
<li><a href="/Store/Order">Order</a> |</li>
<li><a href="/Account/LogOff">Log off</a> ]</li>
</ul>
</li>
</ul>
</nav>
<div id="Parts"></div>
<div id="Categories"></div>
<div id="Links"></div>
</div>
</article>
...
<script type="text/javascript">
$tabs = $('#tabs').tabs();
$('#tabs').tabs('select', 'Categories');
getTab('Categories');
function getTab(id) {
var url = '/Store/Home/GetTab/' + id;
var targetDiv = '#' + id;
$.get(url, null, function (result) {
$(targetDiv).html(result);
});
}
$.address.change(function (event) {
$('#tabs').tabs('select', window.location.hash)
});
$('#tabs').bind('tabsselect', function (event, ui) {
window.location.hash = ui.tab.hash;
});
</script>