Enterキーを押すとsubmitされるのを防ぐ

フォームで、＜input type=”text”＞を選択時にEnterキーを押すと送信されてしまうことがある。
意図しない送信を防ぐために送信ボタンをクリックしたときだけsubmitするようにする簡単なコードです。

See the Pen 170418 by M.Ueda (@nekuta) on CodePen.

フォームにonsubmit=”return false;”を追加

onsubmitはsubmitされたときに発生するイベントです。onsubmit=”return false;”でsubmitを中止する。

送信ボタンをtype=”button”にする

inputがtype=”submit”の場合、送信されてしまうので、type=”button”に変更。onclick=”submit();”でボタンを押したときだけsubmitさせるようにする。

 
 
余談ですが、
ついにCodePenを導入しました。動きも軽快だし、使いやすくてよいですね