我正在尝试让 Bootstrap 选项卡式面板在单击按钮时重新加载,而不仅仅是显示选项卡。因此,单击“office”选项卡将重新加载页面,然后显示#office 选项卡。我一切正常...除了页面重新加载。它永远不会着火。
HTML
<div>
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation">
<a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a> </li>
<li role="presentation" class="active">
<a id="office" href="#office" aria-controls="profile" role="tab" data-toggle="tab">Office</a>
</li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane" id="home">Home</div>
<div role="tabpanel" class="tab-pane active" id="office">Office</div>
</div>
</div>
JS
jQuery("#office").click(function(e){
console.log("clicked")
e.preventDefault();
window.location.replace = "http://www.myurl.com#office";
console.log("after")
return false;
});
https://jsfiddle.net/zxLt5z2r/
更新了 Codepen:
最佳答案
您返回 false 并且还调用了 PreventDefault();
jQuery("#office").click(function(e){
console.log("clicked")
window.location.href = "http://www.myurl.com#office";
console.log("after")
});
另外,使用window.location.href = "http://example.com/new_url";
关于javascript - JS Bootstrap 选项卡式面板,单击时加载 URL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47313601/