データ送信を確認するダイアログを出したい
山崎講師ポイントは8行目の
<form onSubmit = "イベント発生時の処理">という書き方です。
onSubmitというのは「送信した時」という意味のイベントハンドラ【event handler】です。
入力フォームの送信ボタンがクリックされた時に発生するイベント（関数）を記述します。
今回のイベントは14行目以降のconfirmSubmit()という関数です。
戻り値がtrueの場合は入力フォームの内容を送信し、falseの場合は送信されません。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>confirm-submit.html</title>
</head>
<body>
<form method="post" action="https://saycon.co.jp/" onSubmit="return confirmSubmit()">
<input type="text" name="text" value="入力してください">
<button type="submit">送信</button>
</form>
<script>
function confirmSubmit() {
return confirm("本当に送信しますか？");
}
</script>
</body>
</html>参考までにその他のよく使うであろうイベントハンドラを紹介します。
| イベントハンドラ | 説明 |
|---|---|
| onChange | フォーム要素の選択、入力内容が変更された時 |
| onSelect | テキストが選択された時 |
| onLoad | ページや画像の読み込みが完了した時 |
| onClick | 要素やリンクをクリックした時 |
| onKeyUp | 押していたキーをあげた時 |
| onMouseOver | マウスが乗った時 |
