SELECT要素クリック時に表示されるメニューの表示状態を維持したい。

###前提・実現したいこと
SELECT要素をクリックした際に表示されるメニューは要素以外の画面をクリックしたりした際に消えてしまいます。
ブラウザ上部のタイトルクリック時などの際にも同様にメニューは消えてしまいますが、その際にもメニューの表示状態を維持したいです。

###発生している問題・エラーメッセージ
SELECT要素クリック時のメニューの表示、非表示をどうやっても制御できません。。。

###試したこと
・SELECT要素、OPTION要素の属性指定では解決しない。
・CSSでの指定方法でも解決しないと思われる。(visibilityやhiddenなど)
・addEventListnerで思い当たるEvent(blur, click, mouseout, mouseleave)に対して、イベントハンドラーを設定しevent.preventDefault()を実行してもこの挙動を制御できない。

###補足情報
最新バージョンのブラウザで実験したところ、Chrome,FFでタイトルをクリックした際に消えてしまいます。
(IE,Edgeではクリックしても消えません。)

###その他
このメニューの表示、非表示ですが、内部的にどのような処理が行われて、このような挙動となっているのか、
皆目見当もつきません。SELECT要素の標準仕様なども参照してみたのですが、参考になる記述は無かったように思います。
(chromiumの該当のコードとかがわかれば何かわかるのではないかと思って調べてみましたが、挫折してしまいました。)
どなたか詳しい方がいらっしゃれば、何かご教授願えませんでしょうか。よろしくお願い致します。

Youhei-Sakura

2017/10/16 09:21

SELECT要素をクリックした際に表示されるメニューはいつ非表示になるようにするんですか？

ttoshi

2017/10/16 10:06 編集

マニュアル用の画像を自動で取得するプログラムをseleniumで作っており、画像取得用の一時的な改変なので非表示にすることは考えていません。seleniumでのにスクショ撮影時にbody要素にフォーカスか何かが遷移してしまい、それが原因でメニューが閉じてしまいます。タイトルクリック時に表示状態を保つような制御が可能であれば画像取得の際にもメニューが表示されている想定でいます

行動規範の内容に同意します

回答1件

ベストアンサー

multipleではだめですか？

HTML
1<select name="hoge" multiple>
2<option value="">---</option>
3<option value="1">1</option>
4<option value="2">2</option>
5<option value="3">3</option>
6<option value="4">4</option>
7<option value="5">5</option>
8</select>