小编Geo*_*rge的帖子

所以我有一个下拉菜单,根据业务需求单击显示.鼠标离开后,菜单会再次隐藏.

但是现在我被要求让它保持到位,直到用户点击文档的任何位置.如何实现这一目标？

这是我现在拥有的简化版本:

$(document).ready(function() {
  $("ul.opMenu li").click(function(){
   $('#MainOptSubMenu',this).css('visibility', 'visible');
  });

  $("ul.opMenu li").mouseleave(function(){
      $('#MainOptSubMenu',this).css('visibility', 'hidden');
  });
});



<ul  class="opMenu">
  <li id="footwo" class="">
    <span id="optImg" style="display: inline-block;"> <img src="http://localhost.vmsinfo.com:8002/insight/images/options-hover2.gif"/> </span>
      <ul id="MainOptSubMenu" style="visibility: hidden; top: 25px; border-top: 0px solid rgb(217, 228, 250); background-color: rgb(217, 228, 250); padding-bottom: 15px;">
        <li>some</li>
       <li>nav</li>
       <li>links</li>
       </ul>
    </li>
</ul> 

我尝试过这样的$('document[id!=MainOptSubMenu]').click(function()事情,认为它会触发菜单上的任何东西,但它没有用.