HTMLElement: command イベント
Baseline
2025
Newly available
Since December 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
command は HTMLElement インターフェイスのイベントで、 button に有効な commandForElement および command 値がある場合に制御される要素上で、ボタンが操作されたとき（例：クリックされたとき）に発生します。
構文
このイベント名を addEventListener() などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
js
addEventListener("command", (event) => { })
oncommand = (event) => { }
イベント型
CommandEvent です。Event を継承しています。
例
基本的な例
js
const popover = document.getElementById("mypopover");
// …
popover.addEventListener("command", (event) => {
if (event.command === "show-popover") {
console.log("ポップオーバーが表示されようとしています");
}
});
イベントの配信とキャンセル
特筆すべきは、command イベントは呼び出された要素上で発生する点です。ボタンがクリックされると、まず click イベントが発信されます。この click イベントがキャンセルされた場合、command イベントは発生せず、デフォルトの動作も実行されません。
ボタンの click イベントをキャンセルするだけでなく、command イベント自体をキャンセルすることも可能です。
例を示します。
js
button.addEventListener("click", (event) => {
event.preventDefault(); // `command` イベントは発生しない
});
js
element.addEventListener("command", (event) => {
event.preventDefault(); // `command` イベントは発生するが、デフォルトの動作はキャンセルされる
});
仕様書
| Specification |
|---|
| HTML # event-command |