eventTarget.dispatchEvent( eventObject )は、document.createEvent( eventType )メソッドで作ったイベントオブジェクト「eventObject」を、イベントターゲット「eventTarget」に割り当てるメソッド。
構文
var $boolean = eventTarget.dispatchEvent( eventObject )
引数
- eventObject
- 割り当てたいイベントオブジェクトを指定する。
戻り値
イベントハンドラがevent.preventDefault()メソッドを呼び出した場合だけ、「false」を返す。それ以外は「true」を返す。
サンプル
サンプルの動作について
- 「選択/解除」ボタンをクリックすると、「チェックボックス」を選択する。
- 「選択/解除」ボタンを再度クリックすると、「チェックボックス」の選択を解除する。
サンプルのソースコード
JavaScript
<script type="text/javascript">
window.onload = function () {
document.getElementById( "sampleButton" ).onclick = function(){
var $eventObject = document.createEvent( "MouseEvents" );
$eventObject.initEvent( "click", false, false );
var $elementReference = document.getElementById( "sampleCheckbox" );
$elementReference.dispatchEvent( $eventObject );
};
}
</script>
window.onload = function () {
document.getElementById( "sampleButton" ).onclick = function(){
var $eventObject = document.createEvent( "MouseEvents" );
$eventObject.initEvent( "click", false, false );
var $elementReference = document.getElementById( "sampleCheckbox" );
$elementReference.dispatchEvent( $eventObject );
};
}
</script>
HTML
<p>
<input type="checkbox" id="sampleCheckbox" /><label for="sampleCheckbox">チェックボックス</label>
<br />
<button id="sampleButton">選択/解除</button>
</p>
<input type="checkbox" id="sampleCheckbox" /><label for="sampleCheckbox">チェックボックス</label>
<br />
<button id="sampleButton">選択/解除</button>
</p>