链接不会重定向到 Jquery 标签

Question

我有 4 个链接

<li><a class="open-tab" href="#sirkethesaptab">Şirket Hesabı</a></li>
<li><a class="open-tab" href="#musterihesaptab">Müşteri Hesabı</a></li>
<li><a class="open-tab" href="#odemetab">Ödemeler</a></li>
<li><a class="open-tab" href="#harcamatab">Harcamalar</a></li>
<li><a class="open-tab" href="#personeltab">Personel</a></li>

我有一个 Jquery 选项卡

<div class="col-sm-9 padding-right">
    <div id="tab-container2" class='tab-container'>
        <ul class='etabs'>
            <li class='tab'><a href="#sirkethesaptab">Şirket Hesabı</a></li>
            <li class='tab'><a href="#musterihesaptab">Müşteri Hesabı</a></li>
            <li class='tab'><a href="#odemetab">Ödemeler</a></li>
            <li class='tab'><a href="#harcamatab">Harcamalar</a></li>
            <li class='tab'><a href="#personeltab">Personel</a></li>
        </ul>
        <div class='panel-container'>
            <div id="sirkethesaptab">
                <h2>sirkethesaptab</h2>
            </div>
            <div id="musterihesaptab">
                <h2>musterihesaptab</h2>
            </div>
            <div id="odemetab">
                <h2>odemetab</h2>
            </div>
            <div id="harcamatab">
                <h2>harcamatab</h2>
            </div>
            <div id="personeltab">
                <h2>personeltab</h2>
            </div>
        </div>
    </div>
</div>

Jquery 代码

$('#tab-container2').tabs({
    active: $.cookie('activetab'),
    activate: function (event, ui) {
        $.cookie('activetab', ui.newTab.index(), {
            expires: 10
        });
    }
});

$('.open-tab').click(function (event) {
    var tab = $(this).attr('href');
    alert(tab);
    $('tab-container2').tabs('select', tab);
});

当我点击上面的这些外部链接时，我想重定向到必要的选项卡，当我点击这些链接中的任何一个时，浏览器的地址栏会发生变化，但没有重定向。如何解决这个问题？任何帮助将不胜感激。

Answer 1

我准备了这个 plunker，它似乎工作正常：

"http://plnkr.co/edit/I5HCJasIl7OVEci7cwvI"

在 plunkr 中，我将最后一个 <div> 放在底部只是为了检查页面是否导航到那里并且它工作正常。

此外，您必须对 div 中的元素使用 name 属性。请参阅 link 相同的“http://www.htmlgoodies.com/tutorials/getting_started/article.php/3479511”

Answer 2

所以，我猜这是一个愚蠢的错误，因为您在 .open-tab 点击功能中的选择器中缺少 #。

$('.open-tab').click(function (event) {
    var tab = $(this).attr('href');
    alert(tab);
    $('#tab-container2').tabs('select', tab); // <- added #
});

-Demo-

注意：select 选项已从 jQuery UI v1.10+ 中删除。如果您打算使用 1.10+

，则必须使用 .tabs('active', <tabIndex>)

-Demo- 1.10+

链接不会重定向到 Jquery 标签

Links do not redirect to Jquery Tabs

javascript

jquery

redirect

jquery-tabs