1

jQuery の .on イベント ハンドラのドキュメントを読んでいて、それをいじり始めました。

multiple 属性が true に設定された単純な <select> 要素があります。ただし、CtrlキーまたはShiftキーを押さなくても、ユーザーが複数のアイテムを選択できるようにしたい

.on のドキュメントによると、セレクターを指定すると、指定されたセレクターに一致するコンテナー内に追加された新しいアイテムに、これらのイベント ハンドラーが自動的に追加されます。

したがって、私の場合、たとえば、リストボックスで使用可能な <option> 要素を置き換えることを決定できますが、それらのイベントなどを再バインドすることなく、それらのオプションに対して同じ機能を持たせたいと考えています.

次のスニペットでうまくいくはずだと思う人もいるかもしれません (少なくとも、私はそうしました)。

$('#dropdownlist').on('mousedown', 'option', function(e){
    e.preventDefault();
    $(this).prop('selected', $(this).prop('selected') ? false : true);
    return false;
});

したがって、ユーザーがそのリストボックスのオプションをクリックすると、デフォルトのアクションがキャンセルされ、アイテムがすでに選択されているかどうかに応じて、その選択が反転します。

この動作を示す小さなフィドルを作成しました: fiddle

そのフィドルでは、最初のドロップダウンリストは期待どおりに動作していますが、アイテムを置き換えると機能が失われます。これはFFとChromeでのみ機能します。

2番目のドロップダウンリストは、私がそうあるべきだと思っていた方法です（イベント処理の賢明さ）が、それはChrome以外では機能しないようです-.-アイテムを置換しても機能は保持されますそれらを置き換えた後に項目をクリックします。

誰かがなぜこれが起こっているのか説明できますか? 私は何か間違ったことをしていますか？正しい方向に向けてください！

ありがとう！

〜ダーク

4

1 に答える 1

1

IE はオプション タグ自体の mousedown イベントを尊重しません。select タグの OnChange イベントを使用する必要がありますが、これはあなた (または私) が望んでいるものではありません。私はあなたとまったく同じことをしようとしていたのですが、試みのたびに止められました。あなたがここでやろうとしているのと同じ動作を私のものから得ることができるので、私は最終的にあきらめてチェックボックスのリストにしました。

いくつかのオプションについてこの質問を見ることができますが、あなたが説明している方法で機能させることはできませんでした。

于 2013-04-01T23:02:22.033 に答える