单击按钮时禁用只读文本框

Question

我在文本框中使用了“readonly”属性，这使得文本框不可编辑，我可能知道如何在单击按钮时禁用readonly属性。我们可以使用任何脚本吗？

<input type="text" name="" value="" readonly="readonly"/><br/>
<input type="submit" name="" value="update" onclick="" />

Answer 1

你可以做两件事：

• 使用readonly
删除removeAttribute（不区分大小写）属性
• 将readOnly（区分大小写）属性设置为false

HTML：

<input id="myInput"  type="text"  readonly="readonly" /><br />
<input id="myButton" type="submit" value="update" />

JS（选项1）：[Demo]

document.getElementById('myButton').onclick = function() {
    document.getElementById('myInput').removeAttribute('readonly');
};

JS（选项2）：[Demo]

document.getElementById('myButton').onclick = function() {
    document.getElementById('myInput').readOnly = false;
};

Answer 2

您需要将元素的readOnly属性设置为false

您可以使用document.getElementById()，它通过ID

引用该元素

HTML ，这里我添加了元素ID

<input type="text" id="myTextBox" name="" value="" readonly="readonly"/><br/>
<input type="submit" id="myButton"  name="" value="update" />

JavaScript ，您可以在此处看到readOnly属性为false。

document.getElementById('myButton').onclick = function() {
   document.getElementById('myTextBox').readOnly =false;
};

DEMO

此外，我建议您使用'type="button"'代替type="submit"

Answer 3

嗯，简单！您可以使用jQuery删除此属性（jQuery很简单，您也可以使用JS执行此操作）。这是代码：

$('input[type=submit]').click(function () {
  $('input[type=text]').removeAttr('readonly');
})

https://api.jquery.com/removeAttr/