Question

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

我尝试添加代码：

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>

所以我需要在这个脚本中添加一些内容，当点击文件或窗口时关闭下拉菜单但不会干扰点击菜单或下拉菜单。谢谢你的帮助。

Answer 1

在ddMenu_open（）中为$（文档）绑定单击事件触发器ddMenu_close（）。在ddMenu_close（）中取消点击事件的$（文档）。

这是一个例子：

http://jsfiddle.net/bEPvP/

document.onclick close，但在单击菜单时保持打开状态

1 个答案: