Question

我正在使用Jquery隐藏显示div。我希望在'.microblogpostwrapper'悬停时显示div，并在不悬停时隐藏。完成了第一次，但是在没有徘徊时无法隐藏它。

  $(".microblogpostwrapper").hover(function(){ 
            $(this).find(".microblogpostactions").show();
                                });

Answer 1

mouseenter处理程序将针对mouseleave触发一次，针对$(".microblogpostwrapper").hover(function(){ $(this).find(".microblogpostactions").toggle(); // Toggle the show/hide });触发一次。

$(".microblogpostwrapper").hover(function( e ){ 
    $(this).find(".microblogpostactions").toggle( e.type == 'mouseenter' );
});

您可以通过将布尔值传递给.hover()来确保执行正确的切换：

hover()

或者，您可以将第二个功能传递给使用.hide()的{{1}}。

Answer 2

jQuery的.hover() binds two handlers，一个用于'in'，另一个用于'out'。以下内容应该达到你想要的效果（尽管可能值得将你操作的元素分配给变量以提高速度）：

$(".microblogpostwrapper").hover(
    function(){ 
        $(this).find(".microblogpostactions").show();
    },
    function(){
        $(this).find(".microblogpostactions").hide()
    }
);

Answer 3

你可以使用mouseenter / mouseleave来阻止冒泡（在鼠标移动时重新调用悬停）:::

$(".microblogpostwrapper").mouseenter(function() {
    $(this).find(".microblogpostactions").show();
}).mouseleave(function() {
    $(this).find(".microblogpostactions").hide();
});

当我不再徘徊时如何隐藏div

3 个答案: