ie下鼠标经过弹出下拉菜单，菜单里的select点击后下拉菜单消失的问题

xmlll 2016-12-20 10:10:59

求助，如题，因为项目已经用了这种下拉菜单，所以不想改变结构，但不知道怎么解决ie下select的层级问题，把父层都丢掉了，比如以下这种情况：



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>

<script>

$(document).ready(function(){

  $(".aa").mouseover(function(){

  $(".cc").show();

  }).mouseleave(function(){

  $(".cc").hide();

  });

});

</script>

</head>



<body>

<div class="aa" style="width:800px; background:#CCC; margin:0 auto;">

<p style=" text-align:center; line-height:60px; font-size:16px;">戳我</p>

<div class="cc" style="width:720px; height:300px; margin:0 auto; background:#6CF; text-align:center; padding:20px; display:none;">

<select name="">

  <option>菜单一一一一一一</option>

  <option>菜单2222222222</option>

  <option>333333333333333333</option>

  <option>44444444444</option>

  <option>555555555555</option>

</select>

</div>

</div>

</body>

</html>

...全文

377 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

chuangand 2016-12-23

打赏
举报

$(".aa").mouseover(function(){ $(".cc").show(); }).mouseleave(function(){ $(".cc").hide(); }); $("select").mouseleave(function() { return false; });

chuangand 2016-12-23

打赏
举报


   $(".aa").mouseover(function(){
      $(".cc").show();
    }).mouseleave(function(){
      $(".cc").hide();
    });

    $("select").mouseleave(function() {
      return false;
    });

阻止select默认触发的事件