aria-haspopup

ARIA では、表示されることがトリガーされたときに他のコンテンツの上に表示される対話可能なメニュー、リストボックス、ツリー、グリッド、ダイアログは、「ポップアップ」と見なされます。これらのポップアップは、ページ上の 1 つ以上の対話可能要素によってトリガーされます。対話可能要素によってトリガーされるポップアップの可用性とタイプは、aria-haspopup 状態で識別される必要があります。

menu、listbox、tree、grid、dialog、または true の 6 つの列挙値のいずれかを持つ aria-haspopup の存在は、要素がポップアップをトリガーできることと、どの種類のポップアップが表示されるかを示します。次に、ポップアップする要素は、指定されたロールを持つ必要があります。true は menu と同じです。空の文字列や他の ロール を含むその他の値は、false が設定されているものとして扱われます。

tooltip は対話可能ではないため、この文脈ではポップアップとは見なされません。

aria-haspopup 状態は、ポップアップがあることとポップアップの種類を支援技術ユーザーに通知しますが、対話性は提供しません。ポップアップをキーボードでアクセス可能にするには、aria-haspopup を持つ要素がフォーカス可能でポップアップをトリガーできること、ポップアップを開くためのキーボードメカニズムがあること、およびポップアップ要素がその子孫すべてのフォーカスを管理していることを確認してください。

menubar を作成する場合、親の menuitem には aria-haspopup="menu"（または true ）を設定する必要があります。メニューを開くボタンには button ロールを設定するか、できれば <button> 要素である必要があり、さらに aria-haspopup="menu"（または true ）を設定する必要があります。ポップアップメニューを持つ Tab 要素にも aria-haspopup="menu" を設定する必要があります。Webサイトのナビゲーションを作成するために menubar を使用しないでください。

false (既定値)

要素にはポップアップがありません。

true

ポップアップはメニューです。

menu

ポップアップはメニューです。

listbox

ポップアップはリストボックスです。

tree

ポップアップはツリーです。

grid

ポップアップはグリッドです。

dialog

ポップアップはダイアログです。

Element.ariaHasPopup

Element インターフェイスの一部である ariaHasPopup プロパティは、要素によってトリガーできるメニューやダイアログなどの対話可能なポップアップ要素の可用性とタイプを示す aria-haspop 属性の値を反映します。

ElementInternals.ariaHasPopup

ElementInternals インターフェイスのプロパティは ariaHasPopup 属性の値を反映します。

使用するロール:

• application
• button
• combobox
• gridcell
• link
• menuitem
• slider
• tab
• textbox
• treeitem

継承先のロール:

• columnheader
• menuitemcheckbox
• menuitemradio
• rowheader
• searchbox

• aria-controls
• menu
• listbox
• tree
• grid
• dialog
• Toolbar example - W3C WAI ARIA practices