Question

您好我有这种情况，

<ul id="myTab" class="nav nav-tabs" role="tablist">
    <li class=""><a href="#Tab1" role="tab" data-toggle="tab">TAB1</a></li>
    <li class="active"><a href="#archiviobando" role="tab" data-toggle="tab">Tab2</a></li>
    <li><a href="http://www.google.it" role="tab" data-toggle="tab">Tab3</a></li>
</ul>

我只会在前两个链接中使用bootstrap的tab功能...我需要使用普通URL打开最后一个链接...我该怎么办？

我已经插入了用于激活TAB的经典JS代码

$('#myTab a').click(function (e) {
     e.preventDefault()
     $(this).tab('show')
})

但是当我点击最后一个标签时......我看到了这个错误：

Error: Syntax error, unrecognized expression: http://www.google.it
ed?a.value:null:a},at.error=function(e){throw Error("Syntax error, unrecognized ...

解决TNX A @LIX
我用这个代码更改了JS函数，现在工作了！：

$('#myTab a[data-toggle]').click(function

Tnx to all

Answer 1

您可以使用实时/委托事件连接选项卡中的data-toggle="tab"属性

CODE：

<ul id="myTab" class="nav nav-tabs" role="tablist">
    <li class=""><a href="#Tab1" role="tab" data-toggle="tab">TAB1</a></li>
    <li class="active"><a href="#archiviobando" role="tab" data-toggle="tab">Tab2</a></li>
    <li><a href="http://www.google.it" role="tab">Tab3</a></li>
</ul>

Working DEMO

当我评论jQuery代码时：

/*$('#myTab a').click(function (e) {
     e.preventDefault()
     $(this).tab('show')
})*/

然后错误消失了：

错误：语法错误，无法识别的表达式：http://www.google.it ed？a.value：null：a}，at.error = function（e）{throw Error（“语法错误，无法识别..

DEMO With ERROR

Answer 2

是的，您可能只想删除data-toggle="tab"元素的a属性，但如果您想使用某些编码，则可以使用这个简单的逻辑来实现

$("#myTab li").last().on('click', function() {
   window.location.href = 'http://www.google.it';
});

fiddle

tab bootstrap - 打开外部链接

2 个答案: