JavaScriptのonsubmitとは？フォーム送信前に入力チェックを行う方法を解説
onsubmit は、フォームが送信される直前に発生するイベントです。
このイベントの戻り値が false の場合、フォーム送信は中止されます。
入力チェックや送信前処理を行う際に必須のイベントです。
onsubmitイベントとは？
フォームの送信ボタンが押されたとき、または form.submit() が実行されたときに発生します。
使用例：フォーム送信時に関数を実行
→ formCheck() の戻り値が false なら送信されません。
送信を中止する方法
送信を止めたい場合は、return false を返す関数を用意します。
例：常に送信を中止する関数
return false;
}
この関数を onsubmit に設定すると、フォームは送信されません。
入力チェックに利用する例
フォーム送信前に入力内容をチェックし、未入力なら送信を止めることができます。
例：text1 に文字が入力されている場合だけ送信を許可
<input type=”text” name=”text1″>
<input type=”submit” value=”送信”>
</form>
→ 空欄の場合は false が返り、送信されません。
実際のフォーム例（入力チェック付き）
function checkForm() {
let v = document.myForm.user.value;
if (v === ”) {
alert(‘名前を入力してください’);
return false;
}
return true;
}
</script>
<form name=”myForm” onsubmit=”return checkForm()”>
名前：<input type=”text” name=”user”><br>
<input type=”submit” value=”送信”>
</form>
→ 入力が空の場合は送信されず、警告が表示されます。
JavaScript 初心者におすすめの学習書籍
手を動かしながら JavaScript を学びたい方には、初心者向けにやさしく解説された実践型の入門書があります。
実際に動くサンプルを使って学べるため、基本をしっかり身につけたい方に最適です。
→ いちばんやさしい JavaScript の教本
JavaScriptの基礎を体系的に学びたい方には、こちらの書籍がとても分かりやすくおすすめです。
初心者がつまずきやすいポイントを丁寧に解説している入門書です。
→ 確かな力が身につくJavaScript「超」入門
体系的に学びたい方へ（スクールという選択肢）
JavaScript を独学で学んでいると、「もっと効率よく理解したい」「プロに質問しながら進めたい」と感じる方も多いです。
そのような方には、未経験からエンジニアを目指せる DMM WEBCAMP の学習コースも選択肢のひとつです。
無料相談では、学習ロードマップの作成やキャリア相談など、独学では得られないサポートを受けられます。
短期間で基礎を固めたい方や、効率よくスキルを身につけたい方に最適です。
→ DMM WEBCAMP 学習コース（無料相談はこちら）
まとめ
onsubmitはフォーム送信直前に発生するイベント- 戻り値が
falseの場合、送信は中止される - 入力チェックや送信前処理に必須
- return と関数を組み合わせることで柔軟な制御が可能
