Предотвратить клик по окну при привязке клика? - PullRequest
0 голосов
/ 31 января 2011

У меня есть событие щелчка по элементу, который при щелчке связывает другое событие щелчка в окне, которое имеет обратный вызов функции с обратной операцией. В этом случае это просто меню, подобное меню ОС, в котором вы щелкаете меню, а затем, когда вы щелкаете по пункту меню или за его пределами, оно закрывает меню. Подумайте правой кнопкой мыши по меню, 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;
    }
  });

1 Ответ

1 голос
/ 31 января 2011

Вместо привязки к окну вы можете привязать к <body> (я не уверен, будет ли работать остановка распространения при привязке к окну)

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

, а затем вы можете предотвратить распространение событияв щелчке по меню, чтобы оно не запускало щелчок родительских элементов.

$('#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') } );
...