4

我的目标是绑定到页面上的许多元素（使用 on()），然后在单击特定元素后取消绑定（使用 off()）。

$(document).on({
    mouseenter: enter,
    mouseleave: leave,
    mousedown: down,
    mouseup: up,
    click: click
}, ".up_side .thumbsUp");

on() 函数运行良好，但我不知道如何使用 off() 解除与单击元素的绑定。

var click = function() {
    var thumbsUp = $(this);

    var successCallback = function(data) {
        // This is where I need to unbind the clicked element
        $(thumbsUp).off({
            mouseenter: enter, 
            mouseleave: leave
        });
    }

    $(this).castVote(direction, modelName, modelId, successCallback, errorCallback);
}

谢谢！！！

解决方案

使用 .data() 存储标志并在执行代码之前检查标志。这似乎是一种解决方法，并使代码更脆弱。如果有人找到更好的方法，请回帖。谢谢！

    $(document).on({
    mouseenter: function(){
        if ($(this).data("submitted") != true)
        {
            $(this).css("cursor", "pointer");
            $(this).css("backgroundPosition", "-48px");
        }
    },
    mouseleave: function(){
        if ($(this).data("submitted") != true)
        {
            $(this).css("backgroundPosition", "0px");
        }
    },
    mousedown: function() {
        if ($(this).data("submitted") != true)
        {
            $(this).css("backgroundPosition", "-96px");
        }
    },
    mouseup: function() {
        if ($(this).data("submitted") != true)
        {
            $(this).css("backgroundPosition", "0px");
        }
    },
    click: function() {
        if ($(this).data("submitted") != true)
        {
            var thumbsUp = $(this);
            var ballotBox = $(thumbsUp).parent();
            var votingStation = $(ballotBox).parent();

            //ballotBox.hide(0, "", function() {
            var direction = $(thumbsUp).dataset("direction");
            var modelName = $(votingStation).dataset("modelName");
            var modelId = $(votingStation).dataset("modelId");

            var successCallback = function(data) {
                $(thumbsUp).css("backgroundPosition", "-144px");

                // Add flag to indicate successful vote 
                thumbsUp.data("submitted", true)

                $(this).vote_up_side('animateBallotBox', data, ballotBox, thumbsUp);
            }

            var errorCallback = function(XMLHttpRequest, textStatus, errorThrown) {
                $(this).vote_up_side('animateError', ballotBox);
            }

            $(this).castVote(direction, modelName, modelId, successCallback, errorCallback);
        }
    }
}, ".up_side .thumbsUp");
4

3 回答 3

5

.off()文档说：

选择器一个选择器，它应该与.on()附加事件处理程序时最初传递给的选择器相匹配。

和（我的重点）

要删除特定的委托事件处理程序，请提供选择器参数。选择器字符串必须与附加事件处理程序时传递给的字符串完全匹配。.on()

因此，AFAIK 不可能有选择地（没有双关语）从委托的事件处理程序中删除一些元素。

我认为您唯一的选择是将事件处理程序保留在适当的位置，但.data()使用您用来指示该特定元素是否已被单击的一些元素标记每个元素。

于 2012-05-20T07:04:34.017 回答
0

你可以使用“.one()”吗？

来自文档：“要删除与 .on() 绑定的事件，请参阅 .off()。要附加仅运行一次然后自行删除的事件，请参阅 .one()。”

http://api.jquery.com/one/

于 2012-05-20T06:57:07.617 回答
0

实际上，这没有任何意义。off()根据官方 jQuery 文档，在没有选择器的情况下调用时，所有指定的事件都将被删除。因此，无论原始绑定是直接绑定还是委托绑定 ，$(".someElement").off("click")都应该从 中取消绑定所有点击处理程序。如果它不工作，那么 jQuery 有一个错误，你应该提交一个错误报告。".someElement"

你这样做的方式data()肯定会奏效，但我个人认为这是不必要的混搭/破解。

于 2012-06-02T22:50:42.703 回答