2012-03-12 8 views
6

を(jQueryのを使用して):JavaScriptの「select box reveal」イベントなどがありますか?私は、HTMLを選択している

のjQueryを使用して
<select> 
    <option>Choose one</option> 
</select> 

を、選択オプションのリストが明らかにされているとき、私はキャプチャできるイベントはありますか? (私が必要とするのは、リストをユーザーに表示する必要がある瞬間までリストのポピュレーションを延期したいからです。

mousedownは、クリックすると機能しますが、タブをタップしてEnterキーを押すと何もしません。

focusもクリックするだけで動作しますが、ほとんどタブで動くようになりますが、Enterキーを押してオプションリストを表示するまで待つのではなく、すぐにタブで起動します。 (これは問題になります。なぜなら、タブをタップしてEnterキーを押さずにタブをタップすると、イベントが発生しないためです)。

私もこの醜態を思い付いた:

var select_reveal = function(ev) { ... } 
$('select').on('mousedown', select_reveal).on('keydown', function(ev) { 
    // character code 9 is tab 
    if (ev.which !== 9) select_reveal.bind(this)(ev); 
}); 

これ、実際にはseems to work。アルファベット文字を入力すると(リストを入力してからその文字で始まる最初のオプションにジャンプする)場合でも機能します。しかし、私が言ったように、これはやや醜いものです。また、「タブ」を例外としてチェックするのはちょっとハッキーです。選択を明らかにしない他の例外もあります。

このユースケースをカバーするシンプルなイベントはありますか(少なくともそれをカバーするものではありません)。

(注:このようなシステムを構成する選択肢があることはわかっています。たとえば、選択肢を表示するのではなく変更するために先にオプションを入力するなどの方法がありますが、明示的に問題が解決されたかどうか疑問に思う)。

+2

選択肢が拡大される直前に発生するイベントを探しているようですが、項目リストを正しく変更できるほど早いのですか? – JaredPar

+0

@ JaredPar、正しい。 –

+0

Tab Enterはオプションを表示しません。 mousedownへのバインディングで十分です。 –

答えて

4

私は、あなたがこのパスをあまりにも遠く過ぎる前に、どのブラウザをサポートするのかはわかりません。IEの選択リストの内容を変更した場合(例:追加/変更/削除オプション)実際には、リストを開くイベント(マウスカーソルまたはフォーカス)を飲み込んで、閉じた選択リストをユーザに残します。詳細についてはここをクリックhttp://webbugtrack.blogspot.com/2009/02/bug-487-onclickonfocus-bugs-on-select.html

私は本当にロードを遅らせる利点があると思ったら...最初のロード時に選択リストを非表示/無効にし、後にオプションの非同期ロードをトリガーしますレンダリングされました...準備ができたら選択を再び有効にしたり表示したりします。

+1

私はIEについて知りませんでした、ありがとう! –

関連する問題