<script>$(function(){ ? ?$(".select span").click(function(){ ? ? ? ?if( $(this).hasClass('se') ){ ? ? ? ? ? ?$(this).removeClass('se').next(".selectList").removeClass("see"); ? ? ? ?}else{ ? ? ? ? ? ?$(this).addClass('se').next(".selectList").addClass("see"); ? ? ? ?}; ? ? ? ? ? ? ? ?$(this).next(".selectList").slideToggle(100, "linear"); ? ? ? ? ? ?$(".selectList").each(function(){ ? ? ? ? ? ? ? ?var temp = $(".selectList li").text(); ? ? ? ? ? ? ? ?$(".selectList li").click(function(){ ? ? ? ? ? ? ? ? ? ?temp = $(this).text(); ? ? ? ? ? ? ? ? ? ?$(".select").find("span").text(temp); ? ? ? ? ? ? ? ? ? ?$(".selectList").hide(); ? ? ? ? ? ? ? ?}); ? ? ? ? ? ?}); ? ? ? ?}); ? ? ? ?$(document).click(function(event) { ? ? ? ?$(".select span").removeClass("se").next(".selectList").removeClass("see"); ? ? ? ?$(".selectList").hide(); ? ? ? ? ? ?}); ? ? ? ?//點擊其他地方下拉框消失 ? ?$(".select span,.selectList").click(function(event){ ? ? ? ?if(event.stopPropagation) ? ? ? ? ? ?event.stopPropagation(); ? ? ? ?else if(window.event) ? ? ? ? ? ?window.event.cancelBubble = true; ? ? ? ? ? ?}) ? ? ? ?})</script> ? ? ? ?<div class="select"> ? ? ? ? ? ?<span>{dede:type}[field:typename/]{/dede:type}</span> ? ? ? ? ? ?<ul class="selectList"> ? ? ? ? ? ? ? ?<li><a >全國</a></li> ? ? ? ? ? ? ? ?<li><a >北京</a></li> ? ? ? ? ? ? ? ?<li><a >廣州</a></li> ? ? ? ? ? ? ? ?<li><a >深圳</a></li> ? ? ? ? ? ? ? ?<li><a >南京</a></li> ? ? ? ? ? ? ? ?<li><a >成都</a></li> ? ? ? ? ? ? ? ?<li><a >重慶</a></li> ? ? ? ? ? ? ? ?<li><a >武漢</a></li> ? ? ? ? ? ? ? ?<li><a >青島</a></li> ? ? ? ? ? ? ? ?<li><a >杭州</a></li> ? ? ? ? ? ?</ul> ? ? ? ?</div>
1 回答
李曉健
TA貢獻1036條經(jīng)驗 獲得超461個贊
<style>
????.select{
????????width:?100px;
????????margin:?20px?auto;
????????position:?relative;
????}
????span{
????????text-align:?center;
????????display:?inline-block;
????????border:?1px?solid?#ccc;
????????padding:?5px?10px;
????????width:?80px;
????}
????.selectList{
????????border:?1px?solid?#ccc;
????????position:?absolute;
????????top:?29px;
????????display:?none;
????????list-style:?none;
????????margin:?0;
????????padding:?0;
????}
????.selectList?li{
????????padding:?5px?10px;
????????width:?80px;
????????text-align:?center;
????}
????.selectList?li?a{
????????text-decoration:?none;
????????color:?#333;
????}
</style>你的代碼沒有任何問題（要保證你頁面的jquery是引入的），沒看到你的樣式，我就隨便寫了幾行，看起來和你的差不多了
添加回答
舉報
0/150
提交
取消