. setAttribute (“ disable”，false) ; 将可编辑属性更改为 false

Try doing this instead:

function enable(id)
{
var eleman = document.getElementById(id);
eleman.removeAttribute("disabled");
}

To enable an element you have to remove the disabled attribute. Setting it to false still means it is disabled.

http://jsfiddle.net/SRK2c/

the disabled attributes value is actally not considered.. usually if you have noticed the attribute is set as disabled="disabled" the "disabled" here is not necessary persay.. thus the best thing to do is to remove the attribute.

element.removeAttribute("disabled");

also you could do

element.disabled=false;

Just set the property directly: .

eleman.disabled = false;

A disabled element is, (self-explaining) disabled and thereby logically not editable, so:

set the disabled attribute [...] changes the editable attribute too

Is an intended and well-defined behaviour.

The real problem here seems to be you're trying to set disabled to false via setAttribute() which doesn't do what you're expecting. an element is disabled if the disabled-attribute is set, independent of it's value (so, disabled="true", disabled="disabled" and disabled="false" all do the same: the element gets disabled). you should instead remove the complete attribute:

element.removeAttribute("disabled");

or set that property directly:

element.disabled = false;

just replace 'myselect' with your id

to disable->

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

to enable->

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

Using method set and remove attribute

function radioButton(o) {


var text = document.querySelector("textarea");


if (o.value == "on") {
text.removeAttribute("disabled", "");
text.setAttribute("enabled", "");
} else {
text.removeAttribute("enabled", "");
text.setAttribute("disabled", "");
}
  

}

<input type="radio" name="radioButton" value="on" onclick = "radioButton(this)" />Enable
<input type="radio" name="radioButton" value="off" onclick = "radioButton(this)" />Disabled<hr/>


<textarea disabled ></textarea>

There you go,

<div immutable='id,class' id='abc' class='xyz'></div>
<h1 immutable='onclick' onclick='alert()'>HI</h1>
<p immutable='id' subtree>
<!-- now childs id are immutable too -->
<span id='xyz'>HELLO</span>
</p>


</script>
const mutationHandler = entries => {
entries.forEach(entry => {
if (entry.type !== 'attributes') return;
mutationObserver.disconnect()
entry.target.setAttribute(entry.attributeName, entry.oldValue)
observe()
})
}


const mutationObserver = new MutationObserver(mutationHandler)


const observe = () => {
let items = document.querySelectorAll('[immutable]');
items.forEach(item => {
let subtreeEnabled = item.getAttribute('subtree') != null


let immutableAttr = item.getAttribute('immutable')
let captureAttrs = immutableAttr.split(',');
captureAttrs.push('immutable')
captureAttrs.push('subtree')
        

mutationObserver.observe(item, {
subtree: subtreeEnabled,
attributes: true,
attributeOldValue: true,
attributeFilter: captureAttrs
})
})
}
observe()
</script>

An update in 2022.

There is another method toggleAttribute() more specific to this use case if you don't need to consider IE11 and other legacy browsers.

element.toggleAttribute("disabled");

switches between <input value="text" disabled /> and <input value="text" />, and moreover,

element.toggleAttribute("disabled", true);

sets <input value="text" disabled /> explicitly, no matter what state the element was; similarly,

element.toggleAttribute("disabled", false);

sets <input value="text" /> explicitly.