首页 > 其他 > 详细

easyui menubutton combobox 被遮盖问题

时间:2014-01-20 19:29:45      阅读:802      评论:0      收藏:0      [点我收藏+]

bubuko.com,布布扣

 

bubuko.com,布布扣

 

如图一所示,menubutton 中的 combobox 被遮盖 z-Index 不够。这是作者给出的解决方案

 

bubuko.com,布布扣
 1 <a href="#" class="easyui-menubutton" data-options="menu:‘#mm1‘">Search</a>
 2 <div id="mm1" class="menu-content" data-options="hideOnUnhover:false">
 3     <select class="easyui-combobox" data-options="
 4             onShowPanel:function(){
 5                 $(this).combobox(‘panel‘).panel(‘panel‘).css(‘z-index‘,$.fn.menu.defaults.zIndex++);
 6             }
 7             ">
 8         <option>Item1</option>
 9         <option>Item2</option>
10         <option>Item3</option>
11     </select>
12 </div>
bubuko.com,布布扣

 

bubuko.com,布布扣
 1 <script>
 2 $(function(){
 3     $(document).unbind(‘.combo‘).unbind(‘.menu‘)
 4         .bind(‘mousedown.combo‘, handler)
 5         .bind(‘mousedown.menu‘, handler);
 6     function handler(e){
 7         var d = $(e.target).closest(‘span.combo,div.combo-p,div.menu‘);
 8         if (d.hasClass(‘combo-p‘)){
 9             d.find(‘.combo-f‘).each(function(){
10                 var p = $(this).combo(‘panel‘);
11                 if (p.is(‘:visible‘)){
12                     p.panel(‘close‘);
13                 }
14             });
15             return;
16         } else if (d.hasClass(‘combo‘)){
17             return;
18         } else if (d.hasClass(‘menu‘)){
19             return;
20         } else {
21             $(‘body>div.combo-p>div.combo-panel:visible‘).panel(‘close‘);
22             $(‘body>div.menu-top:visible‘).menu(‘hide‘);
23         }
24     }
25 });
26 </script>
bubuko.com,布布扣

easyui menubutton combobox 被遮盖问题

原文:http://www.cnblogs.com/XiaoGer/p/3526654.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!