如何使只读文本字段使用JavaScript写入？

Question

单击按钮（其编号为name_button）时，我想启用文本字段（其编号为name_text_field）。但我的代码不起作用。

这里是我的HTML代码：

<input type="text" id="name_text_field" readonly="readonly" value="name"> 
<button id="name_button" onclick="enableTxt()" style="color: #009dcd; color: #009dcd; border: none; background-color: #ffffff;">name</button> 

这里是我的的JavaScript代码：

function enableTxt() { 
    document.getElementById("name_text_field").disabled = false; 
} 

Answer 1

我想你想使其可写。

因为您正在设置readOnly属性，您应该将readOnly属性更改为false。

function enableTxt() { 
    document.getElementById("name_text_field").readOnly = false; 
} 

DEMO

或者你可以把它disabled在HTML，那么你的代码将工作。

Answer 2

disabled和readonly是两个完全不同的东西。

如果你想你的元素开始禁用，使用

<input type="text" id="name_text_field" value="name" disabled> 

演示：

function enableTxt() { 
 
    document.getElementById("name_text_field").disabled = false; 
 
}

<input type="text" id="name_text_field" value="name" disabled> 
 
<button id="name_button" onclick="enableTxt()" style="color: #009dcd; color: #009dcd; border: none; background-color: #ffffff;">name</button>

Answer 3

试试这个

function enableTxt() { 
    document.getElementById('name_text_field').readOnly = false; 
} 

Answer 4

这很简单。当你真的应该改变readonly时，你试图改变disabled。您也可以只使用残疾人士，并只能一起阅读。

HTML：

<input type="text" id="name_text_field" disabled="true" value="name"> 
<button id="name_button" onclick="enableTxt()" style="color: #009dcd; color: #009dcd; border: none; background-color: #ffffff;">name</button> 

JS：

function enableTxt() { 
    document.getElementById("name_text_field").disabled = false; 
} 

希望我们在这里帮助&是demo for proof!