まず、onsubmit属性とは
form要素 に記述し、送信ボタンを押したとき(submit)に起動するスクリプトを指定するイベント属性(イベントハンドラ)です。
起動するスクリプトは、属性値に "return 関数名()" と書きます。
"true" を返せばフォームのアクションを実行し、"false" なら実行を中止します。
onsubmit イベントで submit を中断するユースケース
- フォーム送信時に JavaScriptで入力値をチェックし、未入力や不正な入力項目がある
- フォーム内に複数のボタンが存在する
では、具体的に onsubmit属性の戻り値を "false" にして submit をキャンセルする記述についてご説明していきます。
以下のコードでは check関数で必須項目が入力されていないときに、return false; を返しキャンセルしようとしていますが submit が実行されてしまいます。
form 要素 の onsubmit 属性の書き方を下記のように変更してください。
フォーム送信をキャンセルするには onsubmit 属性で指定した JavaScript関数のリターン値(false)を return する必要があります。
ちなみに
必ずキャンセルさせたいならば、 onsubmit="check(); return false;" とします。