Element: ariaHasPopup-Eigenschaft
Baseline
2023
Neu verfügbar
Seit October 2023 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.
Die ariaHasPopup-Eigenschaft der Element-Schnittstelle spiegelt den Wert des aria-haspopup-Attributs wider, welches die Verfügbarkeit und den Typ eines interaktiven Popup-Elements, wie etwa ein Menü oder Dialog, angibt, das von einem Element ausgelöst werden kann.
Wert
Ein String mit einem der folgenden Werte:
"false"-
Das Element hat kein Popup.
"true"-
Das Element hat ein Popup, das ein Menü ist.
-
Das Element hat ein Popup, das ein Menü ist.
"listbox"-
Das Element hat ein Popup, das eine Listbox ist.
"tree"-
Das Element hat ein Popup, das ein Baum ist.
"grid"-
Das Element hat ein Popup, das ein Raster ist.
"dialog"-
Das Element hat ein Popup, das ein Dialog ist.
Warnung:
Bitte beachten Sie, dass die Unterstützung für die verschiedenen aria-haspopup-Werte je nach Element, für das das Attribut spezifiziert wird, variieren kann. Stellen Sie sicher, dass bei der Verwendung von aria-haspopup dies in Übereinstimmung mit der ARIA-Spezifikation geschieht und es das erwartete Verhalten zeigt, wenn Sie mit den erforderlichen Browsern und unterstützenden Technologien testen.
Beispiele
In diesem Beispiel wird das aria-haspopup-Attribut des Elements mit der ID animal auf "true" gesetzt. Mit ariaHasPopup aktualisieren wir den Wert auf "listbox", was der erwartete Wert für eine Kombinationsbox ist, die ein listbox-Popup aufruft.
<div class="animals-combobox">
<label for="animal">Animal</label>
<input
id="animal"
type="text"
role="combobox"
aria-autocomplete="list"
aria-controls="animals-listbox"
aria-activedescendant=""
aria-expanded="false"
aria-haspopup="true" />
<ul id="animals-listbox" role="listbox" aria-label="Animals">
<li id="animal-cat" role="option">Cat</li>
<li id="animal-dog" role="option">Dog</li>
</ul>
</div>
let el = document.getElementById("animal");
console.log(el.ariaHasPopup); // true
el.ariaHasPopup = "listbox";
console.log(el.ariaHasPopup); // listbox
Spezifikationen
| Spezifikation |
|---|
| Accessible Rich Internet Applications (WAI-ARIA) # dom-ariamixin-ariahaspopup |