0

現在の実装は Chrome と IE では完全に機能しますが、Firefox では機能しないため、タイトルで Firefox について言及しています。

現在、1 つのドロップダウン メニューに 2 つのグループのチェックボックスがあり、upperFilter と LowerFilter という 2 つの異なるクラスによって識別されます。私がしたいのは、upperFilter グループのチェックボックスがクリックされたときに、lowerFilter グループで既に選択されているチェックボックスが選択解除され、その逆の場合です。

これは私が現在JavaScriptでこれを処理している方法です:

$("INPUT:checkbox").click(function () {

        if ($(this).hasClass("upperFilter") && $('INPUT:checked').filter('.lowerFilter').length > 0) {
            $('INPUT:checked').filter('.lowerFilter').click();
        } else if ($(this).hasClass("lowerFilter") && $('INPUT:checked').filter('.upperFilter').length > 0) {
            $('INPUT:checked').filter('.upperFilter').click();
        }

        // other stuff...

    });

上で述べたように、これは Chrome と IE で機能しますが、Firefox では、複数のチェックボックスが選択されていて、他のグループのチェックボックスを選択すると、以前にチェックしたボックスの 1 つだけが選択解除されます。

奇妙なのは、upperFilter から 3 つのボックスを選択し、Firebug コンソールを開いて入力する$('INPUT:checked').filter('.upperFilter').click();と、3 つすべてを一度に選択解除できることです。また、参考までに、すべての JS はページの最後にロードされます。

ページ内ではなくコンソールで機能する理由がわかりません。

4

1 に答える 1

1

使用する.clickのは正しい方法ではありません。理由は次のとおりです。

あなたのコードは言うwhen some one clicks on the top, trigger the click event on the bottom (and vice versa)。今起こっていることは、誰かがトップをクリックし、次にあなたがボタンをクリックし、それがトップをクリックするということです。

何をしようとしているのかわかりにくく、さまざまなチェックボックスがクリックされたときにページで何が起こるかわかりませんが、clickとchangeイベントの両方を利用する必要があります。

  1. click上部を切り替えると下部が切り替わり、その逆になる現在のロジックを保持します。

  2. .click( ) でクリック イベントをトリガーする代わりに、イベントをトリガーしますchange。したがって、これを置き換えます：

    $('INPUT:checked').filter('.lowerFilter').click();

    これとともに：

    $('INPUT:checked').filter('.lowerFilter').prop('checked', false).trigger('change');

  3. 次に、アプリの他の場所で、チェックボックスの「変更」イベントをリッスンし、それに応じてアプリのその部分を更新する必要があります。

于 2013-10-15T20:16:07.607 に答える