dropdown和tab結合
我想點擊下拉菜單，使得之后的div切換不同的文字，可是點擊完沒效果，不知道哪里出錯
（就是跟tab差不多，只是要換成下拉列表的）
<!DOCTYPE html>
<html>
? ? <head>
? ? ? ? <meta charset="utf-8">
? ? ? ? <meta http-equiv="X-UA-Compatible" content="IE=edge">
? ? ? ? <meta name="viewport" content="width=device-width, target-densitydpi=high-dpi" />
? ? ? ? <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
? ? ? ? <meta name="apple-mobile-web-app-capable" content="yes" />
? ? ? ? <meta name="apple-mobile-web-app-status-bar-style" content="black" />
? ? ? ? <meta name="apple-touch-fullscreen" content="yes"/>
? ? ? ? ? ? ? ??
? ? ? ? <title>Bootstrap的HTML標準模板</title> ??
? ? ? ? <!-- Bootstrap -->
? ? ? ? <link rel="stylesheet" >
? ? ??
? ? ? ? <!--你自己的樣式文件 -->
? ? ? ? ? ? ??
? ? ? ? <!-- 以下兩個插件用于在IE8以及以下版本瀏覽器支持HTML5元素和媒體查詢，如果不需要用可以移除 -->
? ? ? ? <!--[if lt IE 9]>
? ? ? ? <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
? ? ? ? <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
? ? ? ? <![endif]-->
? ? </head>
? ? <body>
<ul class="nav nav-pills" id="myTab">
? ? <li class="dropdown"><a href="#" id="address" class="dropdown-toggle" data-toggle="dropdown" >地址 <b class="caret"></b></a>
? ? ? ? ? <ul class="dropdown-menu" ?role="menu" aria-labelledby="address">
? ? ? ? ? ? ? <li ?><a href="#TianSha" date-toggle="tab" tabindex="-1">地址1</a></li>
? ? ? ? ? ? ? <li ><a href="#DuRuan" date-toggle="tab" ?tabindex="-1" >地址2</a></li>
? ? ? ? ? ? ? <li ><a href="#addressc" date-toggle="tab" ?tabindex="-1">地址3</a></li>
? ? ? ? ? ? ? <li ><a href="#addressd" date-toggle="tab" ?tabindex="-1">地址4</a></li>
? ? ? ? ? </ul>
? ? </li>
</ul>
<div class="tab-content">
? ? <div class="tab-pane active" id="TianSha">
? ? ? ? <ul class=" list-group">
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌天沙河（含雅瑤河）流域污染源信息公開（生活污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌天沙河（含雅瑤河）流域污染源信息公開（工業(yè)污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌天沙河（含雅瑤河）流域污染源信息公開（農業(yè)污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#">更多...</a></li>
? ? ? ? </ul>
? ? ? </div>?
? ??
? ? <div class="tab-pane" id="DuRuan">
? ? ? ? <ul class=" list-group">
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌杜阮河流域污染源信息公開（生活污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌杜阮河流域污染源信息公開（農業(yè)污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#" target="_blank">江門市建成區(qū)黑臭河涌杜阮河流域污染源信息公開（工業(yè)污染源）</a><span>2016-05-18</span></li>
? ? ? ? ? ? <li class="list-group-item"><a href="#">更多...</a></li>
? ? ? ? </ul> ? ? ? ? ? ? ??
? ? ? </div>?
? ??
? ? <div id="addressc" class="tab-pane" >
? ? addressc
? ? </div>
? ??
? ? <div id="addressd" class="tab-pane" >
? ? addressd
? ? </div>
</div>
? ?
? ? ? ? <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
? ? ? ? <!-- 包括所有bootstrap的js插件或者可以根據(jù)需要使用的js插件調用 -->
? ? ? ? <script src="http://cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
? ? </body>
</html>
2016-08-19
通過使用<a>標簽實現(xiàn)的是地址之間的跳轉，你可以看url，是不是地址變了。
想要做出這種效果可以用js的事件來控制面板的隱藏顯示。