invalid ( oninvalid )イベント
invalid ( oninvalid )イベントは、<input>エレメントの送信時に無効な値がある場合に発生するEventインターフェイスのイベントタイプです。
例えば、エレメントに required 属性が設定されていてフィールドが空の場合、送信時にinvalidイベントが発生します。
<input type="text" oninvalid="alert('入力が必須フィールドがあります');" required />
以下は addEventListener() で invalid イベントを追加設定する方法です。
document.getElementsByTagName('form')[0].addEventListener("invalid", (event)=>{
console.log( 'event type : ' + event.type );
});
ページ内 Index
構文（Syntax）
in HTML
<tagelement oninvalid="function()">
in JavaScript
object.oninvalid = function(){ };
object.addEventListener("invalid", script_);
備考（Remarks）
| Bubbles | No |
| Cancelable | Yes |
| Interface | Event |
| Supported HTML Elements | <input> |
Example
invalid ( oninvalid )イベントの例です。
以下の入力項目に８文字以上を入力し送信
を実行してみてください。８文字以内の場合はアラートが出ます。
<form> に関連するイベント
以下は、<form> に関するイベントです。
| イベント | 概要 |
|---|---|
| beforeinput () | 入力が起きたら |
| change ( onchange ) | <FORM>部品において、別の場所をクリックしたり、Tabキーで他にフォーカスが映ると発生 |
| formdata ( onformdata ) | <form> を送信したとき |
| input ( oninput ) | <FORM>部品において入力値が変化したら |
| invalid ( oninvalid ) | <input>エレメントの送信時に無効な値がある場合に |
| reset ( onreset ) | <FORM>部品においてリセットされたら |
| submit ( onsubmit ) | <FORM>においてフォームが送信されたら |
| blur ( onblur ) | ポップアップなどによってWindow、Document、各エレメントがフォーカスを失ったら |
| focus ( onfocus ) | Window、Document、各エレメントがフォーカスされたら |