1

ボタンをクリックした後、スクリプトは新しいコンテンツをロードします。それがロードされている限り、要素のリストをクリック可能にしたくありません。

これらの要素のクリックイベントのバインドを解除し、コンテンツを読み込んでから、イベントを正しく「再バインド」する方法はありますか?

私が防ぎたいのは、すべてのクリック関数/要素内のifステートメントです。

これが私が試したことです:

$(load_button).click(function(){
    $('a').each(function(){
        var dis_e = $(this).data('events');
        $(this).data('disabled-events', dis_e);
    }).unbind('click');

    $(some_content).load(function(){
        $('a').each(function(){
            var dis_e = $(this).data('disabled-events');
            $(this).removeData('disabled-events');
            $(this).bind('click', dis_e);
        });
    });
});

アップデート:

また、要素が(この場合)「クリック」を警告しないようにする必要があります。

$('a').click(function(){
   alert('click');
});
4

2 に答える 2

2

新しいクリックイベントを要素の特定の名前空間に一時的にバインドして、クリックイベントが伝播されないようにし、コンテンツが読み込まれたときにイベントのバインドを解除できます。

$("a").bind("click.disabled", function(e) {
    e.stopImmediatePropagation();
    return false;
});

そして後で:

$("a").unbind("click.disabled");

編集:Yoshiが指摘したように、これは、カスタムイベントの前にクリックイベントハンドラーが要素にアタッチされていることを前提としています。だから私はこれを回避する2つの方法を見ることができます:

  1. 作成時にこのイベントハンドラーを各要素に常にバインドして、カスタムクリックイベントハンドラーの前に常に呼び出されるようにします。そして、あなたはあなたがあなたのデータをロードしているときだけそうstopImmediatePropagation()します。return false
  2. または、この他の質問をチェックして、新しいイベントハンドラーがリストの最初になるようにします。

最初の方法を選択した場合、イベントは次のようになります。

var clicDisabled = false;
$("a").bind("click.disabled", function(e) {
    if (true == clicDisabled) {
        e.stopImmediatePropagation();
        return false;
    }
});

次に、コンテンツをロードするときに、変数clicDisabledを一時的にtrueに設定します。

于 2012-12-05T18:15:02.330 に答える
1

あなたの答えに基づいて、私は次のプラグインを書きました:

(function($){
    $.fn.rebind = function(){
        var init = 'init-rebind';
        return this.each(function() {
            var is_init = $(this).data(init);
            if (!is_init){
                $(this).data(init, true);
                $(this).bind('click.rebind mouseenter.rebind mouseleave.rebind', function(e){
                    if ($(this).hasClass('disabled')){
                        e.stopImmediatePropagation();
                        e.preventDefault();
                    }
                });
            }
        });
    };
})(jQuery);

グローバル変数を使用する代わりに、css内で制御できるようにするために、クラス「disabled」を追加/削除することにしました。

デモをチェックしてください!

みんなにTHX!


更新:これをチェックしてください!!

于 2012-12-06T08:23:56.583 に答える