enum Valeurs : false,true,menu,listbox,tree,grid,dialog
aria-haspopup
Indique qu'un élément peut déclencher l'ouverture d'un popup, et précise le type de ce popup.
Description
aria-haspopup avertit les technologies d’assistance qu’activer l’élément ouvrira un sous-composant contextuel. Les valeurs décrivent le type de popup :
false(défaut) — pas de popuptrue/menu— menu contextuel (role="menu")listbox— liste déroulante (role="listbox")tree— arborescence (role="tree")grid— grille (role="grid")dialog— boîte de dialogue (role="dialog")
Syntaxe
<button aria-haspopup="menu" aria-expanded="false">Options</button>
<button aria-haspopup="dialog">Modifier le profil</button>
Exemples
Bouton de menu déroulant :
<button aria-haspopup="menu"
aria-expanded="false"
aria-controls="menu-options">
Actions
</button>
<ul id="menu-options" role="menu" hidden>
<li role="menuitem">Modifier</li>
<li role="menuitem">Dupliquer</li>
<li role="menuitem">Supprimer</li>
</ul>
Combobox avec liste de suggestions :
<input type="text"
role="combobox"
aria-haspopup="listbox"
aria-expanded="false"
aria-controls="suggestions"
aria-autocomplete="list" />
<ul id="suggestions" role="listbox" hidden>…</ul>
Notes
La valeur true est un alias de menu : préférer la valeur sémantique explicite (menu, dialog, etc.) pour plus de précision.
Combiner avec aria-expanded : aria-haspopup décrit la capacité à ouvrir un popup ; aria-expanded indique l’état courant (ouvert/fermé).
Ne pas sur-utiliser : n’indiquer un popup que si l’élément en ouvre réellement un. Les info-bulles (tooltip) n’ont généralement pas besoin de aria-haspopup.