Element: ariaMultiSelectable プロパティ

Baseline 2023

Newly available

Since October 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

ariaMultiSelectableElement インターフェイスのプロパティで、aria-multiselectable 属性の値を反映し、ユーザーが現在の選択可能な子孫から複数の項目を選択できることを示します。

メモ: 可能であれば、HTML の <select> 要素を使用してください。これは意味づけが組み込まれており、ARIA 属性を必要としないからです。

以下のいずれかの値を持つ文字列です。

"true"

一度に複数の項目を選択することができます。

"false"

選択できる項目は 1 つです。

この例では、ID が listbox1 の要素の aria-multiselectable 属性が "true" に設定されており、この入力が複数の選択項目を受け入れることを示しています。ariaMultiSelectable を使用して、値を "false" に更新します。

html
<div role="listbox" tabindex="0" id="listbox1"
  aria-multiselectable="true" aria-labelledby="listbox1label" aria-activedescendant="listbox1-1">
  <div role="option" id="listbox1-1" class="selected" aria-selected="true">Green</div>
  <div role="option" id="listbox1-2">Orange</div>
  <div role="option" id="listbox1-3">Red</div<
</div>
js
let el = document.getElementById("listbox1");
console.log(el.ariaMultiSelectable); // "true"
el.ariaMultiSelectable = "false";
console.log(el.ariaMultiSelectable); // "false"

仕様書

Specification
Accessible Rich Internet Applications (WAI-ARIA)
# dom-ariamixin-ariamultiselectable

ブラウザーの互換性

BCD tables only load in the browser

関連情報