dede怎么实现下拉不显示当前,如下效果


http://img.mukewang.com/564bebbe0001d7ac00770330.jpg


<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 href="http://www.idp.cn/">全国</a></li>
               <li><a href="http://www.idp.cn/beijing/">北京</a></li>
               <li><a href="http://www.idp.cn/guangzhou/">广州</a></li>
               <li><a href="http://www.idp.cn/shenzhen/">深圳</a></li>
               <li><a href="http://www.idp.cn/nanjing/">南京</a></li>
               <li><a href="http://www.idp.cn/chengdu/">成都</a></li>
               <li><a href="http://www.idp.cn/chongqing/">重庆</a></li>
               <li><a href="http://www.idp.cn/wuhan/">武汉</a></li>
               <li><a href="http://www.idp.cn/qingdao">青岛</a></li>
               <li><a href="http://www.idp.cn/hangzhou">杭州</a></li>
           </ul>
       </div>


kaka137
浏览 1603回答 1
1回答

李晓健

<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是引入的),没看到你的样式,我就随便写了几行,看起来和你的差不多了
打开App,查看更多内容
随时随地看视频慕课网APP