如何使只讀文本字段使用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!