HTMLElement: hidePopover()-Methode

Baseline 2024

Neu verfügbar

Seit April 2024 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

Vollständige Kompatibilität anzeigen
Mehr erfahren

Die hidePopover()-Methode der HTMLElement-Schnittstelle verbirgt ein Popover-Element (d.h. eines mit einem gültigen popover-Attribut), indem es vom Top-Layer entfernt und mit display: none gestylt wird.

Wenn hidePopover() auf einem sichtbaren Element mit dem popover-Attribut aufgerufen wird, wird ein beforetoggle-Event ausgelöst, gefolgt vom Verbergen des Popovers, woraufhin das toggle-Event ausgelöst wird.

Syntax

hidePopover()

InvalidStateError DOMException: Wird ausgelöst, wenn diese Methode aufgerufen wird, während ein anderes Popover bereits im Prozess des Zeigens oder Verbergens ist (z. B. innerhalb eines beforetoggle-Event-Listeners).

Beispiele

Das folgende Beispiel bietet eine Funktionalität, um ein Popover durch Drücken einer bestimmten Taste auf der Tastatur zu verbergen.

HTML

html

<button popovertarget="mypopover">Toggle popover's display</button>
<div id="mypopover" popover="manual">
  You can press <kbd>h</kbd> on your keyboard to close the popover.
</div>

JavaScript

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

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