e.stopPropagetion();
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="http://cdn.bootcss.com/jquery/3.1.1/jquery.js"></script> <style> ul,li{padding:0;margin:0;} li{list-style: none;} .member-grounp{width:200px;height:200px;background:green;} .member-grounp li span{width:50px;height:50px;background:red;display:block;} /*挂断，发言，移除*/ .b_main{position:absolute;left:50%;top:50%;width:88px;} .out{ position:absolute; top:7px; border-color:transparent #d9d9d9 transparent transparent; border-style:dashed dashed solid dashed; border-width:8px; } .dashed{ position:absolute; border-color:transparent #ffffff transparent transparent; border-style:dashed dashed solid dashed; border-width:8px; top:-8px; left:-6px; } .mem-operation{ position:relative; border:1px solid #d9d9d9; padding:5px 0; left:16px; border-radius:5px; background:white; } .mem-operation li{border-bottom:1px solid #d9d9d9;height:40px;line-height:40px;position:relative;text-align:right;cursor:pointer;padding:0 10px;} .mem-operation li:last-child{border:0;} .mem-operation li i{display:block;width:27px;height:23px;position:absolute;top:50%;margin-top:-11px;z-index: 2;} .mem-operation li i.hangupI{background: url(../images/meeting.png) no-repeat;background-position:-143px -24px;} .mem-operation li i.speakI{background: url(../images/meeting.png) no-repeat;background-position:-143px -48px;} .mem-operation li i.removeI{background: url(../images/meeting.png) no-repeat;background-position:-143px -80px;} </style> </head> <body> <ul class="member-grounp"> <li> <span class="m-icon"></span> </li> </ul> <div class="b_main" id="meetingSet" style="display:none;"> <ul class="mem-operation"> <li><i class="hangupI" style=""></i>挂断</li> <li><i class="speakI"></i>发言</li> <li><i class="removeI"></i>移除</li> </ul> <div class="out"> <div class="dashed"></div> </div> </div> </body> </html> <script type="text/javascript"> $(".member-grounp").on('click',"li .m-icon",function (ev) { var omeetingSet = document.getElementById("meetingSet"); // 获取event对象，兼容性写法 var ev = ev || event; //判断显示 omeetingSet.style.display="block"; var mouseDownX = ev.clientX; var mouseDownY = ev.clientY; omeetingSet.style.left = mouseDownX+"px"; omeetingSet.style.top = mouseDownY+"px"; $(document).on("click", function(){ omeetingSet.style.display="none"; }); ev.stopPropagation(); }); $(".member-grounp").on('click',"li",function (ev) { var ev = ev || event; ev.stopPropagation(); }); </script>
