绑定单击时防止单击窗口？答案

【问题标题】：Prevent Click on Window When Binding a Click?绑定单击时防止单击窗口？
【发布时间】：2011-01-31 20:10:44
【问题描述】：

我在一个元素上有一个单击事件，当单击该事件时会在窗口上绑定另一个单击事件，该事件具有带有反向操作的函数回调。在这种情况下，它只是一个类似于 OS 菜单的菜单，您在其中单击菜单，然后当您单击菜单项或菜单外时，它会关闭菜单。想想右键菜单，Ubuntu/Mac 顶部菜单栏等等。

我的问题是，因为我在点击时在窗口上绑定了一个点击事件，所以它也会触发窗口点击。我怎样才能“延迟”它所以它的所有“未来”点击？如果您查找app().debug('closed/clicked?','console');，您会看到两个，它们都在点击时触发...

所以我的代码看起来像：

      {..code...}
      actionMenu: function(action,item){
        if(action == 'open'){
          $(window).bind('click.contextMenus',app().actionMenu('close'));
          $(item).addClass('active').find('ol').css({display:'block',top:$(item).outerHeight()+'px'});
        }
        else if(action == 'close'){
          app().debug('closed?','console');
          $('#menu .active').removeClass('active');
          $('#menu > ol > li ol').css({display:'none'});
          $(window).unbind('click.contextMenus');
        }
      },
      {..code...}

还有：

$('#menu > ol > li').click(function(e){
    if($(this).find('ol').is(':visible')){
      app().actionMenu('close');
    }
    else{
      app().debug('clicked?','console');
      app().actionMenu('open',this);
      return false;
    }
  });

【问题讨论】：

标签： javascript jquery events web-applications window

【解决方案1】：

您可以在<body> 上绑定，而不是在窗口上绑定（我不确定在窗口上绑定时是否会停止传播）

$('body').bind('click.contextMenus',app().actionMenu('close'));

然后您可以阻止菜单的 onclick 上的事件传播，以阻止它触发父元素的 onclick

$('#menu > ol > li').click(function(e){
    e.stopPropagation();
    if($(this).find('ol').is(':visible')){
      app().actionMenu('close');
    }
    else{
      app().debug('clicked?','console');
      app().actionMenu('open',this);
      return false;
    }
  });

编辑

我看的不够仔细。这是问题所在：

$(window).bind('click.contextMenus',app().actionMenu('close'));

您实际上是在此处调用 actionMenu() 函数。你需要这样做：

$(window).bind('click.contextMenus', function() { app().actionMenu('close') } );

【讨论】：

尝试在app().actionMenu('close');之后添加return false;
是的！谢谢你。呃......不敢相信我错过了。再次感谢您！