пожаров ONBLUR события до другого Див-х OnClick

Question

Как и выше, у меня есть кнопка, при нажатии, откроется подменит. Для каждого параметра в подменю есть три элемента (на самом деле я думаю больше, но для простоты это будет 3). Я фокусируюсь на главном div (белый «кадр») подменю. Onblur этого div - я затем спрячу подменю.

Все это ведет себя так, как ожидалось, но у меня есть вопрос, что при нажатии одного из трех элементов для определенного параметра (т. Е. Заданного фокуса) главный div будет закрыт из-за его обработчика события onblur - и функция PopUp это связано с событием onClick элементов для параметров в подменю, которые не запускаются/не выполняются.

Мне нужно только обработать событие onblur главного div таким образом, если параметры не были нажаты.

У меня есть JQuery, чтобы использовать явно, поэтому я более чем счастлив работать с этим, чтобы решить проблему.

Answer 1

Я собираюсь отправить этот ответ - в надежде, что кто-то может улучшить это или предложить альтернативу, потому что она действительно действительно похожа на работу.

Но, что я сделал, это событие onblur - вместо того, чтобы мгновенно скрывать div, я сделал небольшую задержку с использованием тайм-аута, поэтому я не изменяю приоритет событий onblur/onclick но на самом деле дают возможность «стрелять» на «случай».

Answer 2

Вы можете попробовать следующую идею: (Не тестировался, так что потребуется некоторая настройка/отладка ..)

function mouseOverSubMenu(mouseX, mouseY) { 
    var divTop = $('.sub_menu').offset().top; 
    var divLeft = $('.sub_menu').offset().left; 
    var divRight = divLeft + $('.sub_menu').width(); 
    var divBottom = divTop + $('.sub_menu').height(); 


    return (mouseX >= divLeft && 
      mouseX < divRight && 
       mouseY >= divTop && 
       mouseY < divBottom); 
} 


$('.sub_menu, .other_elements').hover(
    function(e) { 
     if (mouseOverStartButton(e.pageX, e.pageY)) { 
      // show menu 
     } 
    }, 
    function(e) { 
     if (!mouseOverStartButton(e.pageX, e.pageY)) { 
      //hide menu 
     } 
    } 
);