jQuery只隐藏div，如果没有徘徊

我正在开发一个弹出式菜单，并遇到了一个小问题，我希望有人可以帮忙。弹出菜单弹出并在弹出窗口外单击关闭它。这一切工作正常。jQuery只隐藏div，如果没有徘徊

我的问题是将div设置为在悬停时显示，并在X秒后自动隐藏，除非用户在时间框内悬停。这意味着弹出窗口会隐藏自身，除非需要。

任何人都可以建议吗？我知道它会涉及setTimeout和clearTimeout，但我不确定如何在上下文中应用它们。

我此刻的代码如下：

$('.links #links-schools a').bind('hover mouseenter', function() { 

    var school  = $(this).text(); 

    $('.links #links-schools a').each(function() { 
    $(this).removeClass("current-menu-item"); 
    }); 

    if(school == "Introduction") { 

    $('.sublinks ul').hide(); 
    $('.links #links-schools ul').removeClass('right-border'); 

    } else { 

    $(this).addClass("current-menu-item"); 

    var str  = $(this).parent().attr('class').slice(-3); 
    var editedstr = str.replace(/\D/g,""); 

    $('.links #links-schools ul').addClass("right-border"); 
    $('.sublinks ul').hide(); 
    $('.sublinks img').show(); 
    $('.sublinks').show(); 

    $.ajax({ 
     url: "http://www.bbdclients.com/sac-active-wp/buildnav.php", 
     type: "POST", 
     data: { parentschoolid: editedstr }, 
     dataType: 'text', 
     success: function(data) { 

     if (data.toLowerCase().indexOf("home") >= 0 || data.length < 1) { 
      $('.sublinks img').hide(); 
      $('.sublinks ul').hide(); 
      return false; 
     } 
     else { 
      $('.sublinks ul').html(data); 
      $('.sublinks img').hide(); 
      $('.sublinks ul').show(); 
     } 
     } 
    }); 

    } 

    return false; 
});

来源

2015-01-06 Graham

请提供一个jsfiddle :) – devqon

你可以这样做：

$('.links #links-schools a').bind('hover mouseenter', function() { 
    var idTimeout; 

    // your code 

    idTimeout = setTimeout(function() { 
     $('#div-to-hide').hide(); 
    }, 5000); 

    $('#div-to-hide').on('mouseenter', function() { 
     clearTimeout(idTimeout); 
    }); 
});

给它一个尝试，让我知道的任何疑虑。

希望它有帮助！

来源

2015-01-06 13:19:54

感谢您的回应！我在执行这段代码时遇到了问题 - div仍然打开，但超时似乎没有触发？（顺便说一下，我正确更新了＃div-to-hide。 – Graham

你还有问题的代码吗？如果你这样做，请告诉我，如果你不这样做，请接受它作为答案:) –

它工作过的魅力，谢谢！我不确定如何接受它作为答案？如果我愚蠢，没有看到选项让我知道，我会更新它:) – Graham

jQuery只隐藏div，如果没有徘徊

回答

相关问题