1. ウェブ
  2. Web API
  3. HTMLElement
  4. hidePopover()

このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

HTMLElement: hidePopover() メソッド

Baseline 2024
最近利用可能

2024年4月以降、この機能は最新のバージョンの端末およびブラウザーで動作します。古い端末やブラウザーでは動作しないことがあります。

hidePopover() は HTMLElement インターフェイスのメソッドで、ポップオーバー要素（すなわち有効な popover 属性がある要素）を最上位レイヤーから外し、display: none のスタイルを付けます。

hidePopover() が popover 属性のついた表示中の要素に対して呼び出された場合、beforetoggle イベントが発行され、続いてポップオーバーが非表示になり、それから toggle イベントが発行されます。要素が既に非表示であれば、エラーが発生します。

構文

js
hidePopover()

引数

なし。

返値

なし (undefined)。

例外

InvalidStateError DOMException

このポップオーバーが既に表示である場合に発生します。

例

ポップオーバーを非表示にする

次の例では、キーボードの特定のキーを押すことで、ポップオーバーを非表示にする機能を提供します。

HTML

html
<button popovertarget="mypopover">ポップオーバーの表示を切り替え</button>
<div id="mypopover" popover="manual">
  キーボードの <kbd>h</kbd> を押すとポップオーバーが閉じます。
</div>

JavaScript

js
const popover = document.getElementById("mypopover");

document.addEventListener("keydown", (event) => {
  if (event.key === "h") {
    popover.hidePopover();
  }
});

結果

仕様書

仕様書
HTML
# dom-hidepopover

ブラウザーの互換性

関連情報

MDN の改良に協力

協力方法を知る

このページは MDN の貢献者によって に最終更新されました。

GitHub でこのページを表示 • このコンテンツに関する問題を報告