首页 文章

如果在pageload上触发，Jquery mouseenter事件将挂起

提问于
浏览 次
0

我在一些元素上使用jqueries mouseenter / mouseleave函数 .

在Mouseenter上，一些内容通过ajax加载并向elemet添加一个菜单 . 在mouseleave上，菜单消失 .

如果我在页面渲染时悬停元素，菜单有时不会消失 . 它们保持可见 . 我无法使用演示代码重现这一点 .

有什么建议？可能是.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'); });

},
jquery hang mouseenter

1 回答

  • 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'); });
}
    回复于

相关问题