如何使用JavaScript将`aria-disabled`设置为true

Question

我对JS一无所知。但是我的Ruby需要加一行代码。我有以下的html。

<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
   <div class="ui-dialog-buttonset">
      <button class="otherButtonClass ui-state-hover ui-state-focus" type="button" role="button" aria-disabled="false">
      <button class="otherButtonClass" type="button" role="button" aria-disabled="false" style="display: none;">
      <button class="cancelButtonClass" type="button" role="button" aria-disabled="false">
   </div>
</div>

我想要JS代码使第一和第二个按钮可见。代码应该怎么写？

请帮忙。

- Arup Rakshit

---

你是否在使用jQueryUI来创建按钮？那么只需要使用$(".otherButtonClass").show().button("enable");即可。 - Bergi

@Bergi，你看到这里有jQuery标签了吗？ - z1m.in

@jQuery00：没有，但有很多类似于jQueryUI的类。这就是我在问的原因。 - Bergi

иҜ·жіЁж„ҸпјҢдёҚеә”еңЁзұ»еһӢдёәвҖңbuttonвҖқзҡ„жҢүй’®е…ғзҙ дёҠдҪҝз”Ёrole="button"жҲ–aria-disabledеұһжҖ§гҖӮ role="button"жҳҜиҮӘеҠЁзҡ„гҖӮеҜ№дәҺеұһжҖ§пјҢиҜ·дҪҝз”ЁdisabledиҖҢдёҚжҳҜaria-disabledгҖӮжңүе…іиҜҰз»ҶдҝЎжҒҜпјҢиҜ·еҸӮи§ҒеңЁHTMLдёӯдҪҝз”ЁWAI-ARIAгҖӮ - Alohci

Answer 1

http://jsfiddle.net/SQ7SH/1/

var buttons = document.querySelectorAll('.ui-dialog-buttonset button');
    buttons[0].setAttribute('aria-disabled', true);
    buttons[1].setAttribute('aria-disabled', true);

同时按钮需要有闭合标签

- z1m.in

Answer 2

当前设置aria-属性的方式是直接引用属性。

要获得：

let el = document.getElementById('foobar');
console.log(el.ariaDisabled); // Should log the current value of aria-disabled.

设置：

let el = document.getElementById('foobar');
el.ariaDisabled = 'true';
console.log(el.ariaDisabled); // Should log 'true'.

参考资料：Element.ariaDisabled MDN

- Mykel

---

目前尚不支持FireFox浏览器。 - ya.teck

Answer 3

var buttons = document.getElementsByClassName('otherButtonClass');
for(var i = 0; i < buttons.length; i++){
    buttons[i].setAttribute('aria-disabled', 'true');
}

- karaxuna

---

最好使用字符串"true"而不是true。 - Bergi

因为它无论如何都被转换为字符串。属性只存储字符串值。 - Bergi

Answer 4

如所要求，需要一行代码：

there is needed one line of code

document.querySelectorAll('.ui-dialog-buttonset .otherButtonClass').forEach(function (item) {item.setAttribute('aria-disabled', true);});

- Kaizo