如何使用JavaScript禁用HTML按钮?

因为此设置不是属性

它是一种属性。

有些属性被定义为布尔值,这意味着您可以指定它们的值,而忽略其他所有属性。i、 e.而不是残疾=“ 残疾人 ,只包括粗体部分。在HTML4中,您 仅包括粗体部分,因为完整版本标记为 a feature with limited support (尽管这一点在编写规范时就不那么正确了)。

这个 DOM property 也被称为 disabled true 或 false .

foo.disabled = true;

理论上你也可以 foo.setAttribute('disabled', 'disabled'); 和 foo.removeAttribute("disabled") ,但我不相信旧版本的internetexplorer会有这样的结果(这是出了名的bug) setAttribute

禁用

document.getElementById("btnPlaceOrder").disabled = true; 

document.getElementById("btnPlaceOrder").disabled = false; 

它是一个属性,但是是一个布尔值(所以它不需要名字,只需要一个值——我知道,这很奇怪)。您可以在Javascript中设置等价的属性:

document.getElementsByName("myButton")[0].disabled = true;

请尝试以下操作:

document.getElementById("id").setAttribute("disabled", "disabled");

正式的方式设置 disabled 上的属性 HTMLInputElement 这是:

var input = document.querySelector('[name="myButton"]');
// Without querySelector API
// var input = document.getElementsByName('myButton').item(0);

// disable
input.setAttribute('disabled', true);
// enable
input.removeAttribute('disabled');

而 @kaushar's answer 足以启用和禁用 ,并且由于IE的历史缺陷,可能更适合跨浏览器兼容性 setAttribute Element 属性阴影 元素 属性。如果设置了一个属性,那么DOM默认使用该属性的值,而不是等效属性的值。

属性和属性之间有一个非常重要的区别。一个真实的例子 HTMLInputElement文件 财产 input.value ,下面演示了阴影的工作原理:

var input = document.querySelector('#test');

// the attribute works as expected
console.log('old attribute:', input.getAttribute('value'));
// the property is equal to the attribute when the property is not explicitly set
console.log('old property:', input.value);

// change the input's value property
input.value = "My New Value";

// the attribute remains there because it still exists in the DOM markup
console.log('new attribute:', input.getAttribute('value'));
// but the property is equal to the set value due to the shadowing effect
console.log('new property:', input.value);

<input id="test" type="text" value="Hello World" />

这就是说属性是阴影属性的意思。此概念也适用于上的继承属性 prototype 链条:

function Parent() {
  this.property = 'ParentInstance';
}

Parent.prototype.property = 'ParentPrototype';

// ES5 inheritance
Child.prototype = Object.create(Parent.prototype);
Child.prototype.constructor = Child;

function Child() {
  // ES5 super()
  Parent.call(this);

  this.property = 'ChildInstance';
}

Child.prototype.property = 'ChildPrototype';

logChain('new Parent()');

log('-------------------------------');
logChain('Object.create(Parent.prototype)');

log('-----------');
logChain('new Child()');

log('------------------------------');
logChain('Object.create(Child.prototype)');

// below is for demonstration purposes
// don't ever actually use document.write(), eval(), or access __proto__
function log(value) {
  document.write(`<pre>${value}</pre>`);
}

function logChain(code) {
  log(code);

  var object = eval(code);

  do {
    log(`${object.constructor.name} ${object instanceof object.constructor ? 'instance' : 'prototype'} property: ${JSON.stringify(object.property)}`);
    
    object = object.__proto__;
  } while (object !== null);
}

我希望这能澄清关于属性和属性之间区别的任何混淆。

它仍然是一个属性。设置为:

<input type="button" name=myButton value="disable" disabled="disabled">

... 是有效的。

b.disabled=false;

我认为最好的办法是:

$("#ctl00_ContentPlaceHolder1_btnPlaceOrder").attr('disabled', true);

<button disabled=true>text here</button>

您仍然可以使用属性。只需使用“disabled”属性而不是“value”。