new Eventコマンド

コマンド new Event はイベントコンストラクタで、これを用いてイベントオブジェクトを作成し、その後 dispatchEvent メソッドを使ってJavaScriptからそのイベントを発生させることができます。これが必要な理由：ユーザーによるボタンのクリックやフォーム送信の試みなどを模倣することができます。この時、イベントは event.isTrusted プロパティ以外は本物のイベントと何も変わりません。非標準の（あなたが考え出した）名前を持つイベントを作成し、必要な時にそれを発生させることも可能です。

構文

new Event(イベントタイプ, [フラグ]);

例

ボタンがあるとします。このボタンをクリックするとメッセージが表示されます。マウスをボタンにホバーさせた時に、そのボタンがクリックされたと認識するようにしてみましょう：

<button id="button">ボタン</button>

let button = document.querySelector('#button');

button.addEventListener('click', function() {
	alert('メッセージ');
});

button.addEventListener('mouseover', function() {
	let clickEvent = new Event('click'); // イベントを作成
	this.dispatchEvent(clickEvent); // ボタンのクリックを模倣
});

例

独自のイベント（独自の名前を持つ）を作成し、後で必要な時にそれを発生させることができます。ボタンに showMessage イベントをバインドし、マウスホバー時にそのイベントを発生させてみましょう：

<button id="button">ボタン</button>

let button = document.querySelector('#button');

button.addEventListener('showMessage', function() {
	alert('メッセージ');
});

button.addEventListener('mouseover', function() {
	let showMessageEvent = new Event('showMessage'); // イベントを作成
	this.dispatchEvent(showMessageEvent); // イベントの発火を引き起こす
});

new Eventコマンド

構文

例

例

関連項目