Question

我正在为我的应用程序使用jQuery UI 动态标签。我想在用户单击选项卡时更新URL哈希值。

我在SO上找到了一些解决方案，例如link1 和link2。

我尝试的解决方案如下：

使用Javascript：

$( "#tabs" ).tabs({
    select: function(event, ui) {                   
        window.location.hash = ui.tab.hash;

        if ( ui.index == 0) // its preloaded
                return;                               
    }
});

HTML：

<div id="tabs" > 
    <ul>
        <li><a href="#tabs-1"   > Tab 1  </a></li>
        <li><a href="Home/Test1"> Tab 2  </a></li>
        <li><a href="Home/Test2"> Tab 3  </a></li>            
    </ul>
    <div id="tabs-1">
        Some Text
    </div>
</div>

此解决方案采用href值来更新URL。因此，对于第一个选项卡，URL哈希变为#tabs-1。但是，对于其他标签，网址哈希为：#ui-tabs-1和#ui-tabs-2。

我希望网址哈希值为#Employee而不是#ui-tabs-1。

有什么想法吗？

Answer 1

我试过几种方法。我找到的最简单的方法是向锚元素添加name属性。因此，HTML部分如下。

<div id="tabs" > 
    <ul>
        <li><a href="#tabs-1"   > Tab 1  </a></li>
        <li><a name ="Employee" href="Home/Test1"> Tab 2  </a></li>
        <li><a name ="Address"  href="Home/Test2"> Tab 3  </a></li>            
    </ul>
    <div id="tabs-1">
        Some Text
    </div>
</div>

javascript部分将保持不变。

jQuery UI选项卡，更新动态选项卡的URL

1 个答案: