プルダウンを矢印キーではなくEnterキーで開く方法

Question

初めて質問致します。

現在、作成したページのキーボード操作の検証を行っているところです。
ChromeではEnterキーでプルダウンを開けますが、
firefoxやIEでは矢印キーでないと選べません。

記載したHTMLは以下の通りです。

<select name="hoge" id="fuga">
	<option value="0" selected="selected">メニュー1</option>
	<option value="1">メニュー2</option>
</select>

firefoxやIEでもEnterキーでプルダウンを開く方法があれば、
教えていただけると幸いです。

宜しくお願い致します。

Answer 1

基本はブラウザの仕様と思います。htmlだけでなんとかできるものではないようです。

javascriptを利用してそれっぽく動かす？

javascriptでonkeypressでenterキーをとって・・と思いましたが、javascript側から制御はできないようですね。

• javascriptでselectタグを開く方法

• jQueryでセレクトボックスをマウスオーバーかホバーで開くことは可能でしょうか？

上記の回答に幾つか「それっぽく見せる方法」を回答してくれている人がいます。
この方法を参考にし、「セレクトボックスでEnterした」というのを合わせれば、
「Enter押したらセレクトボックスが開いたっぽく見せる」というのが実現可能に思います。

セレクトボックスでEnter押したのを感知

<select name="hoge" id="fuga" onKeyPress="select_press(event,this);">
    <option value="0" selected="selected">メニュー1</option>
    <option value="1">メニュー2</option>
</select>

function select_press(e,o){
    if (e.keyCode == '13') {
        console.log("Enter!!");
    }
}

追記：
ちょっとコストに見合わないように思いますね・・
alt+↑（or↓）でChromeと同じように開きますが、それじゃダメですよね。。？

Comments

[A_BeCky]

ご丁寧に過去の質問までご用意いただきありがとうございます！
まだ検証はしていませんが、うまくいかなければ追記に書いていただいた方法で押し通します！

[m.ts10806]

無理やり作るより「ブラウザの仕様でENTERではできませんがこうすれば同じように開けます」の方がいいかもしれませんね。