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 に答える