如何通过 jQuery 设置 `aria-selected=true`

Question

如何使用 jQuery 将 aria-selected="false" 的状态更改为 aria-selected="true"？

在这里你可以看到我是如何尝试做到的：

$('element aria-selected').html(true)
$('element aria-selected').text(true)
$('element aria-selected').val(true)
$('element').attr('aria-selected', 'true').prop('selected', true)
$('element').attr('aria-selected', 'true')
$('element').prop('selected', true)

Answer 1

$('element').attr('aria-selected',true);

这将解决您的问题

Answer 2

只有 prop() 或 attr() 可以将 aria-selected 属性设置为 true

正确的代码是：

$('element').prop('aria-selected', true);

或

$('element').attr('aria-selected', true);

每个属性的详细信息：

如果元素是像 div、p、h1、b、a 等容器，则需要使用 html() html() 方法设置或returns 所选元素的内容（内部HTML）。

$('element aria-selected').html(true)

所以html()在这里不起作用。

如果元素是像 div、p、h1、b、a 等容器，则需要使用 text() 与 .html() 方法不同，.text() 可以在 XML 和 HTML 文档中使用。 .text() 方法的结果是一个包含所有匹配元素的组合文本的字符串。

$('element aria-selected').text(true)

所以text()在这里不起作用。

如果元素是文本、隐藏等输入字段，则需要使用 val()

$('element aria-selected').val(true)

所以val()在这里不起作用。

prop() 方法设置或 returns 所选元素的属性和值。 .prop() 方法仅获取匹配集中第一个元素的属性值。 returns undefined for a 属性 that has been set

的值

$('element').attr('aria-selected', 'true').prop('selected', true)
$('element').prop('selected', true)

attr() 方法设置或 returns 所选元素的属性和值。

$('element').attr('aria-selected', 'true')

所以 attr() 将在这里工作。

Answer 3

香草 JavaScript 解析代码：

var elem = document.querySelector("yourSelector");
elem.setAttribute('aria-selected', false); //If attribute is true, and false needed
elem.setAttribute('aria-selected', true); //If attribute is false, and true needed

Answer 4

以下解决方案适用于 jQuery：

$('element').prop('ariaSelected', false);
$('element').prop('ariaSelected', true);

如何通过 jQuery 设置 `aria-selected=true`

How to set `aria-selected=true` via jQuery

jquery

dom

wai-aria