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