【问题标题】:Bootstrap AJAX tabs don't work, nothing happens引导 AJAX 选项卡不起作用,没有任何反应
【发布时间】:2015-04-03 15:01:07
【问题描述】:

当我点击“工具”标签时,什么都没有发生:标签不会切换,也不会切换。

$('[data-toggle="tab"]').click(function(e) {
	var $this = $(this),
		loadurl = $this.attr('href');

	$.get(loadurl, function(data) {
		$('#content').html(data);
	});

	$this.tab('show');
	return false;
});
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css" rel="stylesheet"/>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="container">
      <ul class="nav nav-tabs nav-justified" role="tablist">
        <li role="navigation" class="active"><a href="/engine/ajax/main.php" aria-controls="main" role="tab" data-toggle="tab">My links</a></li>
        <li role="navigation"><a href="#tools" aria-controls="stat" role="tab" data-toggle="tab">Statistics</a></li>
        <li role="navigation"><a href="/engine/ajax/tools.php" aria-controls="tools" role="tab" data-toggle="tab">Tools</a></li>
        <li role="navigation"><a href="#payments" aria-controls="payments" role="tab" data-toggle="tab">Payments</a></li>
      </ul>
    </div>

    <div id="content" class="container">

    </div>

我哪里错了?

【问题讨论】:

标签: javascript ajax twitter-bootstrap


【解决方案1】:

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;

之前

&lt;script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"&gt;&lt;/script&gt;

像这样:

<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/css/bootstrap-combined.min.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.1.1/js/bootstrap.min.js"></script>

bootstrap.min.js 要求 jquery.min.js 在它之前先运行。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-03-26
    • 1970-01-01
    • 2018-05-16
    • 2018-04-03
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多