Событие JQuery mouseenter зависает при запуске pageload

Question

Я использую функции jqueries mouseenter/mouseleave для некоторых элементов.

В Mouseenter некоторый контент загружается через ajax и добавляет меню элементу. На мышином плеере меню исчезает.

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

Любые предложения? Может быть проблема с .data()?

$(document).on('mouseenter', '._hoverflow', channels.smallMenu); 
$(document).on('mouseleave', '._hoverflow', channels.smallMenu); 

toggleMenu: function(p,i){ 
    if(p.data('loaded') === true ){ 
     if(p.data('visible') === true){ 
      i.stop(true,true).fadeOut('fast'); 
      p.removeClass('fadet').data('visible',false); 
     } 
     else{ 
      i.stop(true,true).fadeIn('fast'); 
      p.addClass('fadet').data('visible',true); 
     } 
     return true; 
    } return false; 
}, 
smallMenu: function(a){ 
    var p = $(this), cid = parseFloat(p.data('id')), i = p.find('.channel-dropdown'); 
    if(channels.toggleMenu(p,i)){ return false; } 
    p.addClass('fadet').data('loaded',true).data('visible',true); 
    var s = $.post(channels.vars.details, { id: cid }); 
    s.done(function(data){ channels.menuTemplate(data, cid).appendTo(p).stop(true,true).fadeIn('fast'); }); 

}, 

Answer 1

Я думаю, что проблема в том, что после того, как вы установили p.data('loaded', true) вы не можете переключать состояние видимости из-за вашего p.data('loaded') === true проверки в toggleMenu.

Перемещение логики вокруг, так что вы всегда можете переключать видимость, но только загружать содержимое сразу:

toggleMenu: function(p,i){ 
    if(p.data('visible') === true){ 
     i.stop(true,true).fadeOut('fast'); 
     p.removeClass('fadet').data('visible',false); 
    } 
    else{ 
     i.stop(true,true).fadeIn('fast'); 
     p.addClass('fadet').data('visible',true); 
    } 
}, 

smallMenu: function(a){ 
    var p = $(this), cid = parseFloat(p.data('id')), i = p.find('.channel-dropdown'); 

    // Always toggle the menu visibility. 
    channels.toggleMenu(p,i); 

    // But only load the content once. 
    if(p.data('loaded') === true){ return false; } 
    p.addClass('fadet').data('loaded',true).data('visible',true); 
    var s = $.post(channels.vars.details, { id: cid }); 
    s.done(function(data){ channels.menuTemplate(data, cid).appendTo(p).stop(true,true).fadeIn('fast'); }); 
}