html输入元素仍在使用"；残疾人士；样式，在删除“后”；残疾人士；通过javascript访问属性

我有几个输入元素。当页面加载时，我禁用了输入。然后，当用户单击编辑时，删除

disabled

属性，以便用户可以对其进行编辑。但当按下编辑按钮并删除禁用的

时，输入样式仍使用禁用的输入样式。
我怎样才能解决这个问题

js:

document.querySelector（“#启用更新”）.addEventListener（'click'，函数（）{
var i；
var inputs=document.querySelectorAll（“#管理数据输入”）；
对于（i=0；i

html:


纳米

PS：我使用的是材料Lite设计


**更新**

（*我在js文件上编辑了一些语法）

我想要实现的是实现这一目标


为此（注意“名称”文本为蓝色）


当我检查inspect元素时，它显示了这一点（注意“fieldset[disabled]”，但输入没有disabled属性）

下面是一个关于您的代码的固定版本：


第一个问题是，您选择了“管理数据”中的输入，但没有将该ID添加到包装div中

第二个问题是输入[0]。焦点（）；在for循环之外

不需要var i；当您在for循环中声明它时

document.querySelector('#enable-update').addEventListener('click', function () {
    var inputs = document.querySelectorAll('#manage-data input');
    for (var i = 0; i < inputs.length ; i++){
        inputs[i].disabled = false;

        inputs[i].focus();
    }
    this.style.display = 'none';
});

是浅灰色的，因为那不是目标

目标是：

.mdl-textfield.is-disabled .mdl-textfield__input

ID
在
JS
中指定的属性在标记中不存在..这种行为是由于'var i'@IshankDubey的范围行为造成的-我不这么认为…你能提供一把小提琴吗？工作正常：啊，我刚刚意识到这一点。我想我也很关注
[禁用]
一个。谢谢
document.querySelector('#enable-update').addEventListener('click', function () {
    var inputs = document.querySelectorAll('#manage-data input');
    for (var i = 0; i < inputs.length ; i++){
        inputs[i].disabled = false;

        inputs[i].focus();
    }
    this.style.display = 'none';
});

<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label" id="manage-data">
    <input disabled class="mdl-textfield__input" type="text" id="name" name="name" value="user">
    <label class="mdl-textfield__label" for="name">Nama</label>
</div>

<button id="enable-update">
Enable
</button>

fieldset[disabled] .mdl-textfield .mdl-textfield__input

.mdl-textfield.is-disabled .mdl-textfield__input