formのoptionでEnter(Return)する方法はありますか？

こんにちは。
ローカルのWebサーバーで通販サイトで商品の検索結果を取得する為に下記の様なhtmlを作成しています。

-----ここから-----
<form action="./result.php" method="post">
<p style="text-align:left;">検索語句：<input type="text" name="words" size="80" autofocus></p>
<p>リスト
<select name="engine" size="10" multiple>
<option selected>AmazonJP</option>
<option>楽天</option>
<option>ヨドバシカメラ</option>
<option>Yahooショッピング</option>
<option>ASKUL(アスクル)</option>
</select>
</p>
<input type="submit" value="送信"><input type="reset" value="リセット">
-----ここまで-----

htmlの文法としてはlabelが無かったり、option valueじゃなかったりで間違っていたりするかもしれませんが、
一応、送信ボタンを押すと実行できます。

ここで、optionで検索する通販サイトをセレクト(反転)させたとき、つまり、フォーカスが当たった時にEnter(Return)を受け付けて、そうすることによってresult.phpにPOSTしたいと考えております。

この様な方法はありますでしょうか？

以上、お手数をお掛け致しますが、よろしくお願いいたします。

No.1 ベストアンサー 回答者： Ogre7077 回答日時： 2019/03/04 11:11

<script>

document.addEventListener('DOMContentLoaded',function(ev){
_ document.forms['対象フォーム要素を特定する名前'].addEventListener('keydown',function(ke){
_ _ if (ke.target.tagName != 'SELECT') return;
_ _ var enter = (ke.key == 'Enter' || ke.keyCode == 13);
_ _ var modify = !(ke.metaKey || ke.altKey || ke.shiftKey || ke.ctrlKey);
_ _ if (enter && modify) ke.currentTarget.submit();
_ });
});
</script>

この回答へのお礼

こんにちは。出来ました！ありがとうございます。

お礼日時：2019/03/04 13:37