Question

我试图在鼠标输入鼠标离开事件时替换图像属性源。单击时，图像应保持活动状态。我需要在点击完成后停止mouseleave事件。到目前为止，mouseeleave仍然继续点击，切换回图像，这是下面的代码：

<script>
    jQuery('.paypal').mouseenter(function(){
        jQuery('.paypal').attr('src','http://url-to-my-active-image.jpg');?>');
    }),
    jQuery('.paypal').mouseleave(function(){
        jQuery('.paypal').attr('src','http://url-to-my-inactive-image.jpg');
    }),
    jQuery('.paypal').click(function(){
        jQuery('.paypal').css('opacity','1');
    });
</script>

我怎样才能实现这一目标？。

Answer 1

点击以下内容时，只需转动off鼠标左键：

jQuery('.paypal').click(function(){
    jQuery('.paypal').css('opacity','1').off('mouseleave');
});

Answer 2

快速解决方案似乎是在点击时添加一个类，然后检查mouseleave上是否存在该类;如果它在那里，什么都不做。

<script>
    jQuery('.paypal').mouseenter(function(){
        jQuery('.paypal').attr('src','http://url-to-my-active-image.jpg');?>');
    }),
    jQuery('.paypal').mouseleave(function(){
        if(!jQuery('.paypal').hasClass('selected')){
            jQuery('.paypal').attr('src','http://url-to-my-inactive-image.jpg');
        }
    }),
    jQuery('.paypal').click(function(){
        jQuery('.paypal').css('opacity','1').addClass('selected');
    });
</script>

@ j08691的答案可能更容易维护，特别是如果你使用最新版本的jQuery（1.7或更高版本）。

Answer 3

您可以使用mouseleave关闭click处理程序中的off处理程序：

jQuery('.paypal').click(function() {
    jQuery('.paypal').css('opacity', '1');
    jQuery('.paypal').off('mouseleave');
});

jquery mouseenter执行此操作，mouseleave执行此操作，单击执行此操作并停止mouseenter / mouseleave事件

3 个答案: