gpt4 book ai didi

jquery - 在 Twitter Bootstrap 中重新加载当前事件选项卡

转载 作者:行者123 更新时间:2023-12-01 03:16:47 25 4
gpt4 key购买 nike

我正在关注this recommendation关于如何能够使用以下命令重新加载当前事件选项卡:

$('#tab-loaded-content').load($('li.active a[data-toggle="tab"]').attr('href'));

但是当我尝试这个时,结果是它加载最初的事件选项卡(在我的 html 中定义为事件的选项卡),而不是当前的事件选项卡。因此,我正在寻求一些帮助来弄清楚如何做到这一点。

这是我的问题的简化版本:

<!DOCTYPE html>
<html>
<head>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<body>
<div class="tabbable">
<ul id="mainTabs" class="nav nav-tabs">
<li class="active"><a href="#tabWelcome" data-toggle="tab">Home</a></li>
<li><a href="#tabProject" data-toggle="tab">Project</a></li>
<li><a href="#tabEmail" data-toggle="tab">Invite Friends</a></li>
<li><a href="#tabProfile" data-toggle="tab">My Profile</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tabWelcome">
welcome
</div>
<div class="tab-pane" id="tabProject">
project
<button id="button" class="btn">Create Project</button>
</div>
<div class="tab-pane" id="tabEmail">
email
</div>
<div class="tab-pane" id="tabProfile">
profile
</div>
</div>
</div>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script>
<script>
document.getElementById("button").addEventListener("click", function() {
$('#mainTabs').load($('li.active a[data-toggle="tab"]').attr('href'));
}, false);
</script>
</body>
</html>

这个想法是,当单击第二个选项卡上的“项目”按钮时,它应该重新加载该选项卡,但它会重新加载“欢迎”选项卡。

任何建议表示赞赏!

最佳答案

我必须实现一个非常相似的功能。

基本上,您需要获取当前选项卡“停用”并再次显示它。

$(document).on('click', '#refresh', function () {
var $link = $('li.active a[data-toggle="tab"]');
$link.parent().removeClass('active');
var tabLink = $link.attr('href');
$('#mainTabs a[href="' + tabLink + '"]').tab('show');
});

查看我的jsFiddle一个工作演示。

请注意,演示使用 Bootstrap 3,因此使用 shown.bs.tab 事件来显示选项卡加载时间。

关于jquery - 在 Twitter Bootstrap 中重新加载当前事件选项卡,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15113157/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com