Limited support 一部のブラウザのみ対応。使用時はサポート状況を確認すること。
テキスト・構造 Limited support

<dialog closedby>

closedby 属性はダイアログを閉じる手段（ESCキー、外部クリック等）を制御します。'any'、'closerequest'、'none' を指定できます。

テキスト・構造

概要

closedby 属性はダイアログを閉じる手段（ESCキー、外部クリック等）を制御します。'any'、'closerequest'、'none' を指定できます。

対応ブラウザ

デスクトップ

Chrome 134+
Edge 134+
Safari 未対応
Firefox 141+

モバイル

Chrome Android 134+
Safari iOS 未対応
Firefox Android 141+

基本構文

HTML 
<!-- ESCキーや外部クリックで閉じない -->
<dialog closedby="none" id="important">
  <p>重要なメッセージ</p>
  <button onclick="this.closest('dialog').close()">OK</button>
</dialog>

実務での使いどころ

  • <dialog closedby> の活用

    dialog要素のclosedby属性。ダイアログの閉じる手段を制御する属性。

注意点

  • 一部のブラウザでのみ対応。使用前にブラウザサポートを確認すること。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。

参考リンク