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.

Mehr erfahren
Vollständige Kompatibilität anzeigen

Die hidePopover() Methode der HTMLElement Schnittstelle verbirgt ein Popover Element (d.h. eines mit einem gültigen popover Attribut), indem es aus der obersten Schicht entfernt und mit display: none gestyled wird.

Wenn hidePopover() bei einem angezeigten Element mit dem popover Attribut aufgerufen wird, wird ein beforetoggle Ereignis ausgelöst, gefolgt von der Ausblendung des Popovers und dann dem toggle Ereignis. Wenn das Element bereits ausgeblendet ist, wird ein Fehler ausgelöst.

Syntax

hidePopover()

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

Beispiele

Das folgende Beispiel bietet die Funktionalität, ein Popover durch Drücken einer bestimmten Taste auf der Tastatur auszublenden.

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();
  }
});