1

これが私の問題の JSFiddleです。

これにはJQuery 2.0.2を使用していることに注意してください。

JQuery チェックボックス ツリー プラグインを使用しています。手動で 内Subgroup B2のすべての要素をクリックSubgroup B2すると、チェックもオンになります。逆に、子の 1 つを手動でオフにSubgroup B2すると、「部分選択」状態になり、すべての子のチェックを外すと完全にオフになりSubgroup B2ます。これはうまく機能し、意図したとおりです。

ただし、上部のボタンに注意してください。

これらのクリック イベントをコードでトリガーしようとしています。

最初のボタンは、ラベルのクリック イベントを発生させます (これは、ボックス/テキストを手動でクリックしたときにクリックされるものです)。お気づきのとおり、すべてのボックスがチェックされていますが、Subgroup B2部分的にしか選択されていません。

ボタンをもう一度クリックすると、チェックボックスが再びオフになりますが、そうではありません。それがボタン2の目的です。何らかの理由でボタンのチェックを外すには、チェックボックスをチェックするのに必要な要素とは別の要素をクリックする必要があります。これは私には意味がありません。

最後に、インタラクション (実際のクリックとコード化されたクリック) を混在させると、事態はさらにバラバラになります。

私はこれに何時間も取り組んできましたが、インタラクションに問題が発生するたびに、チェックボックスが原因でした。

チェックボックスがコード化されたクリックを手動のクリックと同じように尊重するようにするにはどうすればよいですか?

4

1 に答える 1

2

ボタンの問題は、トリガーされたイベントが DOM をバブリングすることに起因すると考えられます。それを回避するtriggerHandler()代わりに使用できますがtrigger()、このメソッドは最初に一致した要素にのみ影響するため、ループで使用する必要があることに注意してください。

$("#trigChildren").on('click', function () {
    $('#one, #two, #three').each(function () {
        $(this).parent().triggerHandler('click');
    });
});

更新されたフィドル

于 2013-10-09T06:00:01.263 に答える