このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
Element: ariaHasPopup プロパティ
Baseline 2023Newly available
Since October 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
ariaHasPopup はElement インターフェイスのプロパティで、aria-haspopup 属性の値を反映し、要素によって発生させることができるメニューやダイアログなどの対話型ポップアップ要素の型と利用できるかどうかを示します。
In this article
値
以下のいずれかの値を持つ文字列です。
"false"この要素にはポップアップがありません。
"true"この要素にはメニューであるポップアップがあります。
"menu"この要素にはメニューであるポップアップがあります。
"listbox"この要素にはリストボックスであるポップアップがあります。
"tree"この要素にはツリーであるポップアップがあります。
"grid"この要素にはグリッドであるポップアップがあります。
"dialog"この要素にはダイアログであるポップアップがあります。
警告:様々なaria-haspopup 値への対応は、属性を指定する要素によって異なる可能性があることに注意してください。aria-haspopup を使用する際には、ARIA 仕様に準拠し、必要なブラウザーや支援技術でテストした際に期待通りの動作をするようにしてください。
例
この例では、ID がanimal の要素のaria-haspopup 属性は "true" に設定されています。ariaHasPopup を使用して、値を "listbox" に更新します。これはlistbox ポップアップを呼び出すコンボボックスとして有益な値です。
<div> <label for="animal">Animal</label> <input type="text" role="combobox" aria-autocomplete="list" aria-controls="animals-listbox" aria-activedescendant="" aria-expanded="false" aria-haspopup="true" /> <ul role="listbox" aria-label="Animals"> <li role="option">Cat</li> <li role="option">Dog</li> </ul></div>let el = document.getElementById("animal");console.log(el.ariaHasPopup); // trueel.ariaHasPopup = "listbox";console.log(el.ariaHasPopup); // listbox仕様書
| Specification |
|---|
| Accessible Rich Internet Applications (WAI-ARIA)> # dom-ariamixin-ariahaspopup> |