Javascript 绑定和解除绑定功能

1） 当

#pin_point

处于悬停状态时，我将两个绝对定位的图像设置为fadeToggle，以便它随淡入效果变化：

$("#pin_point").hover(function  hoverhandler() {
    $("#pin_point img").fadeToggle('medium');
});

2） 单击

#pin_point

时，我将pin_point

img

设置为交换为“ex.png”：

3） 单击

#pin_point

时，我还解除了#1（上图）中悬停功能的绑定

问题：如果我想在再次单击#pin_point时绑定函数， 我该怎么办？下面是我的代码，我很难弄清楚。 有人能帮忙吗

$("#pin_point").click(function() {
    $('#pin_point').unbind('hover', hoverhandler);
    $("#pin_point img").attr('src','images/ex.png');
    $('#pin_point').bind('hover', hoverhandler);
});

---

悬停

是一种速记事件。而是取消绑定

mousenter

和

mouseleave

。还将状态信息附加到元素，以在每次单击时获得替代效果

function hoverhandler() {
    $("img", this).stop(true, true).fadeToggle('medium');
}
$("#pin_point").hover(hoverhandler);

$("#pin_point").click(function () {
    var $this = $(this),
        enableHover = $this.data('enableHover'), //get the current state
        method = "bind"; //default mathod to bind

    if (!enableHover) {  //if alternate click to disable
         method = "unbind"; //change the method
    } 

    $this[method]('mouseenter mouseleave', hoverhandler); //apply the method
    $this.find("img").prop('src', 'http://placehold.it/40x40');
    $this.data('enableHover', !enableHover);//save the state in the element to toggle between each click

});

如果您使用的是jquery版本>=1.7，则可以使用

打开

和

关闭

---

您要传递给

的内容。悬停

是一个。它的名称不应该对其他代码可用，您必须将其作为函数声明：

function hoverhandler() {
    $("#pin_point img").fadeToggle('medium');
}
$("#pin_point").hover(hoverhandler);

根据jQuery：

调用

$（选择器）。悬停（handlerIn，handlerOut）

是以下内容的简写：

$（选择器）.mouseenter（handlerIn.mouseleave（handlerOut）

这样你就可以解除与

$("#pin_point").off('mouseenter'. hoverhandler).off('mouseleave', hoverhandler );

你能解释一下你想要发生什么，以及如何解决你的特定问题吗？你能告诉我你到底想做什么吗？我试图在再次单击“pin#u point”时显示“pin#u point img”，而不是“image/ex.png”。够清楚吗？我试过了，但没用。第二次单击“锁定点”时。在（步骤1）中，它没有变回“pin#u point img”。我只是在文档中发现了一些有趣的东西，答案更新了。请立即重试。再次单击div时，它不会变回50X50。相反，它将更改为40X40，这是来自src的img属性。你能告诉我怎么解决这个问题吗？@kclie你可以添加该部分来切换其他部分中的图像。。。看这个@kclie这是你要的吗？在这种情况下，图像不会在第二次单击时变回30X30
$("#pin_point").off('mouseenter'. hoverhandler).off('mouseleave', hoverhandler );