HTMLElement: popover-Eigenschaft

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Die popover-Eigenschaft des HTMLElement-Interfaces ruft den Popover-Status eines Elements ab und legt ihn über JavaScript fest ("auto" oder "manual"), und kann zur Funktionsdetektion verwendet werden.

Sie spiegelt den Wert des globalen HTML-Attributs popover wider.

Wert

Ein enumerierter Wert; mögliche Werte sind:

  • "auto": Im Auto-Zustand:
    • Das Popover kann "leicht verworfen" werden — dies bedeutet, dass Sie das Popover ausblenden können, indem Sie außerhalb davon klicken oder die Esc-Taste drücken.
    • Normalerweise kann nur ein Popover gleichzeitig angezeigt werden — das Anzeigen eines zweiten Popovers, wenn bereits eines angezeigt wird, blendet das erste aus. Die Ausnahme von dieser Regel ist, wenn Sie verschachtelte Auto-Popover haben. Siehe Verschachtelte Popovers für mehr Details.
  • "manual": Im manuellen Zustand:
    • Das Popover kann nicht "leicht verworfen" werden, obwohl deklarative Schaltflächen zum Anzeigen/Ausblenden/Umschalten weiterhin funktionieren.
    • Mehrere unabhängige Popovers können gleichzeitig angezeigt werden.

Beispiele

Funktionsdetektion

Sie können das popover-Attribut verwenden, um die Popover API zu erkennen:

js
function supportsPopover() {
  return HTMLElement.prototype.hasOwnProperty("popover");
}

Einrichten eines Popovers programmgesteuert

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

const popoverSupported = supportsPopover();

if (popoverSupported) {
  popover.popover = "auto";
  toggleBtn.popoverTargetElement = popover;
  toggleBtn.popoverTargetAction = "toggle";
} else {
  console.log("Popover API not supported.");
}

Spezifikationen

Specification
HTML Standard
# dom-popover

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch