フォーム内の入力項目内でEnterキーを押下したときの挙動の差異

cyrus07424cyrus07424

以下のような、formタグ内に入力項目が複数、type属性がsubmitなボタンが存在する場合、入力項目内でEnterキーを押下すると自動でフォームが送信される。

<form action="hoge">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <button type="submit">送信</button>
</form>

ボタンのtype属性をbuttonにすると、入力項目内でEnterキーを押下すると自動でフォームが送信されなくなる。

<form action="hoge">
    <input type="text" name="input1">
    <input type="text" name="input2">
    <button type="button">送信</button>
</form>

しかし、formタグ内の入力項目が1つの場合は入力項目内でEnterキーを押下すると自動でフォームが送信されることに注意。

<form action="hoge">
    <input type="text" name="input1">
    <button type="button">送信</button>
</form>

挙動を確認したブラウザ : Waterfox 2019.10