文档.Onclick关闭，但保持打开时，菜单单击

document.onclick close but keep open when menu is clicked

本文关键字：菜单 单击 Onclick 关闭 文档      更新时间：2023-09-26

好的，我有这个下拉菜单脚本。它的工作很好，当所有的点击发生在菜单本身，但当我点击菜单的下拉不关闭。我希望菜单关闭，如果用户点击屏幕上的某个地方，而不是实际的菜单。

我试过添加代码:

document.onclick = ddMenu_close;

但是这使得菜单永远不会打开，因为它通过函数调用"open"，但随后立即关闭它，因为它随后调用onclick ddMenu_close。我的脚本如下:

<script type="text/javascript">
  function ddMenu() {
    var timeout    = 500;
    var closetimer = 0;
    var ddmenuitem = 0;
    function ddMenu_open(e)
    {
       ddMenu_close();
       var submenu = $(this).find('ul');
        if(submenu){
            ddmenuitem = submenu.css('visibility', 'visible');
        }
    }
    function ddMenu_close()
    {  if(ddmenuitem) ddmenuitem.css('visibility', 'hidden'); }
    function ddMenu_timer()
    { closetimer = window.setTimeout(ddMenu_close, timeout); }
    function ddMenu_canceltimer()
    {  if(closetimer)
       {  window.clearTimeout(closetimer);
          closetimer = null;}}
    $(document).ready(function()
    {  $('#ddMenu > li').bind('click', ddMenu_open);
       $('#ddMenu li ul').bind('click', ddMenu_timer);

    });

    }
    </script>

所以我需要添加一些东西到这个脚本，将关闭下拉当文档或窗口被点击，但不干扰点击菜单或下拉。谢谢你的帮助。

在ddMenu_open()中为$(document)绑定点击事件触发ddMenu_close()。在ddMenu_close()中取消$(文档)的单击事件。

下面是示例:

http://jsfiddle.net/bEPvP/

相关文章：