0
我想在我的代码使用引导选项卡，但它似乎并没有work.The标签得到显示，但是当我点击他们什么也没有发生，所有内容show.I写我的代码与bootstrap文件相同，我不知道问题出在哪里？ 我已经读过Twitter Bootstrap tabs not working for me问题，但它并不能帮助我。Twitter的引导标签都不尽如人意
<!DOCTYPE HTML>
<html dir="rtl" lang="">
<title>انتشارات رویای پارسیان</title>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, height=device-height"/>
<script type="text/javascript" src="js/html5shiv.js"></script>
<link rel="stylesheet" type="text/css" href="stylecss/bootstrap.min.rtl.css.css">
<link rel="stylesheet" type="text/css" href="stylecss/bootstrap-3.2.rtl.css">
<link rel="stylesheet" href="fa/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="stylecss/style.css">
<link rel="stylesheet" type="text/css" href="font/stylesheet.css">
<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jscript.js"></script>
</head>
<body>
<div class="best-sells col-md-12">
<!-- <h3>پرفروش ترین ها</h3> -->
<ul class="nav nav-tabs" role="tablist" data-toggle="tab">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#home" role="tab">تازه ترین</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#profile" role="tab">پرفروش ترین</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#messages" role="tab">محبوب ترین</a>
</li>
</ul>
<div class="tab-pane active" id="home" role="tabpanel">
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
</div>
<div class="tab-pane" id="profile" role="tabpanel">
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
</div>
<div class="tab-pane" id="messages" role="tabpanel">
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
<div class="book1">
<div class="sidebar-text">
<p>پاییز فصل آخر سال است</p>
<p>15000 تومان</p>
</div>
</div>
</div>
</div>
</body>
</html>
jQuery的一部分
$(document).ready(function() {
$('#tabs').tab();
});
这是我fiddle
纠正你的小提琴......添加JS把JS部分而不是CSS。 –
@Leothelion纠正它。 – mkafiyan