尽管有很多 Twitter Bootstrap 问题与我遇到的类似问题有关,但我无法找到任何解决我的特定问题的方法。我正在使用 twitter 引导程序“选项卡”功能来显示内容,虽然脚本成功更改了更改活动选项卡,但内容保持不变。
这是代码:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello, Tabs!</title>
<link rel="stylesheet" href="public/css/bootstrap.min.css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script>
<script type="text/javascript" src="public/js/bootstrap.min.js"></script>
</head>
<body>
<h3>Version Information:</h3>
<div class="tabbable tabs-left">
<ul class="nav nav-tabs" data-tabs="tabs">
<li class="active">
<a href="#project/src/Graph/Graph.pm__0" data-toggle="tab">9424</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__1" data-toggle="tab">9058</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__2" data-toggle="tab">8928</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__3" data-toggle="tab">8926</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__4" data-toggle="tab">8924</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__5" data-toggle="tab">8890</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__6" data-toggle="tab">8889</a>
</li>
<li>
<a href="#project/src/Graph/Graph.pm__7" data-toggle="tab">8887</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="project/src/Graph/Graph.pm__0">
<p>
Author: joe<br>
Version: v9424 (1:31 pm February 28, 2013)<br>
Action: Modified<br>
Message: Finalized a bit of the code... should be better now.<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__1">
<p>
Author: joe<br>
Version: v9058 (9:13 pm February 26, 2013)<br>
Action: Modified<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__2">
<p>
Author: joe<br>
Version: v8928 (2:08 am February 25, 2013)<br>
Action: Modified<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__3">
<p>
Author: joe<br>
Version: v8926 (1:14 am February 25, 2013)<br>
Action: Modified<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__4">
<p>
Author: joe<br>
Version: v8924 (10:26 pm February 24, 2013)<br>
Action: Modified<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__5">
<p>
Author: joe<br>
Version: v8890 (9:59 pm February 23, 2013)<br>
Action: Modified<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__6">
<p>
Author: joe<br>
Version: v8889 (9:53 pm February 23, 2013)<br>
Action: Added<br>
Message: Hello, world!<br>
</p>
</div>
<div class="tab-pane" id="project/src/Graph/Graph.pm__7">
<p>
Author: joe<br>
Version: v8887 (9:40 pm February 23, 2013)<br>
Action: Added<br>
Message: Hello, world!<br>
</p>
</div>
</div>
</div>
<script type="text/javascript">
jQuery(document).ready(function ($) {
$('.nav-tabs').tab();
});
</script>
</body>
</html>
当我运行它时,所有依赖文件都加载得很好(作为参考,正在使用的引导程序版本是 2.3.1)。我一直在处理这个问题已经有一段时间了,所以任何帮助都将不胜感激。
编辑:这是一个包含错误代码的 jsfiddle 链接。