Question

使用

动态禁用表单中的html按钮

document.getElementById('Btn').disabled = true;

稍后，我希望了解按钮的状态，如果已禁用或已启用。使用以下内容不起作用：

if (document.getElementById('Btn').disabled == "true") {

解决方案是什么？

Answer 1

你可以使用：

if (document.getElementById('Btn').disabled) {

浏览器将呈现disabled="disabled"或disabled。它取决于浏览器的实现。因此，只检查带有禁用属性的true字符串将不起作用。

上面的代码只会检查它是否已禁用属性或者说有禁用属性。

Answer 2

disabled属性访问器可能非常混乱。有一个属性和属性访问器可以隐藏属性。

您可以使用document.getElementById('Btn').hasAttribute('disabled')来检查元素是否被禁用，或只是document.getElementById('Btn').disabled，因为属性getter也会返回一个布尔值：

＆＃13;

function logAttribute (btn, attr) {
  console.log(`hasAttribute ${btn.hasAttribute(attr)}`)
  console.log(`getAttribute ${btn.getAttribute(attr)}`)
  console.log(`hasOwnProperty ${btn.hasOwnProperty(attr)}`)
  console.log(`[attr] ${btn[attr]}`)
}

const btn = document.createElement('button')

console.log('----- uninitialized')
logAttribute(btn, 'disabled')
btn.disabled = true
console.log('----- set')
logAttribute(btn, 'disabled')
btn.disabled = false
console.log('----- unset')
logAttribute(btn, 'disabled')

＆＃13;

.as-console-wrapper{max-height:100%!important;}

＆＃13;

Answer 3

属性disabled包含布尔值而不是字符串，因此它必须是：

if (document.getElementById('Btn').disabled == true) {

或者只是

if (document.getElementById('Btn').disabled) {

w3c html5: 4.10.7 The input element：

interface HTMLInputElement : HTMLElement {
   // ... 
   attribute boolean disabled;
}

因此，无论对属性或属性有什么价值，如果您访问属性disabled，您将始终获得布尔值。

如何访问禁用的按钮

3 个答案: