Обработка/распространение/пузырь событий jQuery?

Я пытаюсь создать меню для веб-сайта, использую для этого jQuery и столкнулся с небольшой проблемой.

у меня такая структура

<div class="menuTitle menuDiv menuNode" id="menuNode_<?=$row_menu["id"]?>">
    <a href="<?=$rt?>" class="menuAnchor" onclick="return registerMenuClick($(this).parent())">
        <span><?=$nodeName?></span>
    </a>
</div>

<div class="menuSelect" id="menuSelect_<?=$row_menu["id"]?>" align="center"><?=$nodeName?></div>

А в jQuery у меня есть

$(document).ready(function(){
    $(".menuNode, .menuSelect").live("mouseover",function(event){
    MenuBar.selectedID = $(this).attr("id").replace("menuNode_","").replace("menuSelect_","");
    MenuBar.showThisBranch();
  }).live("mouseout",function(event){
    MenuBar.selectedID = $(this).attr("id").replace("menuNode_","").replace("menuSelect_","");
    MenuBar.hideThisBranch();
  });
})

Когда пользователь наводит курсор на menuNode, должен отображаться menuSelect (так оно и есть), но если я наведу курсор на menuAnchor или диапазон, он запускает событие mouseout, а затем событие mouseover.

Итак, если, скажем, у меня была мышь над menuNode, и я перешел к диапазону, а затем снова к menuNode, это вызовет событие mouseover 3 раза. У меня было такое поведение раньше при событии щелчка, но кажется, что метод, используемый для решения этой проблемы, не работает с этой проблемой.

Какие-либо предложения?


person desto    schedule 05.09.2012    source источник
comment
Попробуйте «mouseenter» и «mouseleave» вместо «mouseover» и «mouseout». Пример здесь объясняет   -  person Beetroot-Beetroot    schedule 06.09.2012
comment
См. спецификацию событий DOM здесь.   -  person Barmar    schedule 06.09.2012


Ответы (1)


Как предложил @Beetroot-Beetroot, mouseenter/mouseleave помогли в сочетании с TimeOut для перехода от menuNode к menuSelect (300 миллисекунд при входе, 500 при выходе).

person desto    schedule 06.09.2012