Question

有人可以帮我吗？我有一个mouseenter和mouseleave效果，并希望在点击其他div时禁用它。这是我的代码

$('.offer-content').on('mouseenter', function(){
    $(this).find('.offer-desc').show()
}).on('mouseleave', function(){
   $(this).find('.offer-desc').hide()
})
$(".st_sharethis").click(function(){
        $flex(".offer-content").off('mouseleave');
    });

我想要发生的是当我关闭＆＃34; .st_sharethis＆＃34;时再次启用mouseenter和mouseleave。类

提前感谢！

Answer 1

您需要将$ flex更改为$

以下代码适合您：

$('.offer-content').on('mouseenter', function(){
    $(this).find('.offer-desc').show()
}).on('mouseleave', function(){
    $(this).find('.offer-desc').hide()
});
$(".st_sharethis").click(function(){
    $(".offer-content").off('mouseleave');
});

您还可以对其进行测试：http://jsfiddle.net/Qz2Rk/

Answer 2

我创造了一个所需行为的小提琴。从您的问题看，您似乎想在.st_sharethis点击切换事件行为。下面的代码按预期工作。

点击切换事件按钮和行为，每次点击都会切换。

小提琴链接：

http://jsfiddle.net/hPAjF/

使用更好的css更新版本：

http://jsfiddle.net/hPAjF/1/

HTML：

<div class="offer-content"><div class="offer-desc"></div></div>

<div class="st_sharethis">Toggle events</div>

CSS：

.offer-content{
    width:200px;
    height:200px;
    background-color:#900;
    cursor:pointer;
}

.offer-desc{
    width:100px;
    height:100px;
    background-color:#090;
    display:none;
}

.st_sharethis{

    width:100px;
    height:30px;
    background-color:#009;
    cursor:pointer;
}

JS：

$('.offer-content').on('mouseenter', function(){
    $(this).find('.offer-desc').show()
}).on('mouseleave', function(){
   $(this).find('.offer-desc').hide()
})
var mouseLeave = 0;
$(".st_sharethis").click(function(){
    if(mouseLeave==0)  
    {
        $(".offer-content").off('mouseleave');
        mouseLeave=1;
    }
    else
    {     $('.offer-content').on('mouseleave', function(){
   $(this).find('.offer-desc').hide()
});
     mouseLeave = 1;
    }

    });

在您的网站中，我已经从控制台添加了以下代码，并且它已经提供了您想要的行为。

jQuery(".stCloseNew2").click(function(){

jQuery('.offer-content').on('mouseleave', function(){
   jQuery(this).find('.offer-desc').hide()
});
});

禁用并启用mouseenter和mouseleave

2 个答案: