3
UPDATE 原來這是一個已知問題 - 它根本沒有出現在Stack Overflow的任何搜索中。希望這篇文章引發了這個問題的關注。Bootstrap標籤下拉式不能在移動設備上工作
從本質上看，Twitter Bootstrap從2.2.1開始仍然存在問題，該選項卡下拉功能在移動設備上正常工作。
事實上，在某些Android和iOS版本上查看時，即使他們自己的上述鏈接文檔也無法正常工作。爲了測試您的設備上，嘗試使用此下拉功能：http://twitter.github.com/bootstrap/javascript.html#tabs
有關此問題的更多的解決方案和進步，看到更詳細的Twitter的引導Github上回購：https://github.com/twitter/bootstrap/issues/4550
////// ////////////////////////////////////////////////// ////////////
使用Twitter Bootstrap 2.2.1樣板文件（css，js）和標準文檔我無法獲得移動設備上的下拉選項卡（在Android 4.1上測試過）在瀏覽器和Chrome中）
代碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<script src="./js/jquery-1.8.2.min.js"></script>
<script src="./js/bootstrap.min.js"></script>
<script>
$('#myTab a').click(function (e) {e.preventDefault();
$(this).tab('show');
})
</script>
</head>
<body>
<div class="row">
<div class="span12">
<ul id="myTab" class="nav nav-tabs">
<li class="active"><a href="#home" data-toggle="tab">Home</a></li>
<li><a href="#profile" data-toggle="tab">Profile</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#dropdown1" data-toggle="tab">@fat</a></li>
<li><a href="#dropdown2" data-toggle="tab">@mdo</a></li>
</ul>
</li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="home">
<p>Raw</p>
</div>
<div class="tab-pane fade" id="profile">
<p>Food</p>
</div>
<div class="tab-pane fade" id="dropdown1">
<p>Etsy</p>
</div>
<div class="tab-pane fade" id="dropdown2">
<p>Trust</p>
</div>
</div>
</div>
</div>
</body>
</html>
任何想法？
感謝您的回覆Rishi。 我知道，最好向用戶說清楚哪些選項是最前面的，但是我正在構建的有3個類別（汽車品牌），用戶可以從中選擇哪一個類別單獨有14個選項汽車模型）。我不希望用戶導航到每個頁面，而是一個比較工具。也就是說，下拉菜單會影響整個流程，並有更好的用戶體驗（在我看來）。 事實證明，我收到的錯誤是一個已知問題，並已提交給Github回購：https://github.com/twitter/bootstrap/issues/4550 – teknover
在github鏈接上，您可以找到一些解決方法 - '$（'a.dropdown-toggle，.dropdown-menu a'）。on（'touchstart'，function（e）{e.stopPropagation（）; }）;'是一個並且正在爲許多用戶如果它也適用於你，... $（'body'）。on（'touchstart.dropdown'，'.dropdown-menu'，function（e）{e.stopPropagation（）;}）;'is另一個解決方法.. –