2

以下のようにイベントをバインドしました。

    $(document).delegate('.budget', 'click', function(e){
        if ($(this).hasClass('collapsed')) {
           $(this).removeClass('collapsed');
           $(this).addClass('expanded');
        }
        else if ($(this).hasClass('expanded')) {
           $(this).removeClass('expanded');
           $(this).addClass('collapsed');
        }
    });

基本的に、これは展開と折りたたみを切り替えます。

以下のようにバインドされた別のイベントがあります。

    $('[id^="tree"]').delegate('.collapsed', 'click', function(e){
        var elementId = $(this).attr('id');
        hideChildElement(elementId);
    });

2 番目のイベント バインディングによってバインドされた要素は、最初のイベント バインディングによってバインドされた要素の親です。何が起こるかというと、最初のバインディング イベント メソッドの要素をクリックすると、2 番目のイベント バインディングによってバインドされたイベントもトリガーされます。2 番目のイベント バインディングから 1 番目のイベント バインディング メソッドにイベントがバインドされないようにしたいと考えています。

要素 A が最初のイベント バインディングのクリック イベントにバインドされ、B が 2 番目のイベント バインディングにバインドされている場合 (A が B の内部にあるか、A が B の子である)、B のイベントを A に伝播させたくありませんe.stopImmediatePropagation();。働いていない

4

1 に答える 1

0

要素がクリックされ[id^="tree"]た場合にトリガーされるようにバインドされたイベントハンドラーを防ぎたいと思います。.budgedその場合、クリック イベントの発生元をテストできます。

$('[id^="tree"]').delegate('.collapsed', 'click', function(e){
    if($(e.target).closest('.budget').length === 0) {
        // not from inside budget element
        var elementId = $(this).attr('id');
        hideChildElement(elementId);
    }
});

あるいは、両方のイベント ハンドラーを同じ要素にバインドする場合、つまり、両方documentまたは[id^="tree"]その間の任意の要素にバインドすると、event.stopImmediatePropagation()問題なく動作します。

これがあなたの望むものでない場合は、質問を明確にしてください。理解するのは簡単ではありません.

于 2012-09-01T15:46:32.040 に答える