使用js動態控制input框的唯讀屬性

input 方塊的唯讀屬性： readonly

在頁面中直接加入為唯讀時，可在input中直接新增 readonly="readonly"，但若想透過點擊按鈕來改變的話，需要透過js（或jquery）來實現。

最近一次使用這個，終於發現了以前寫這個js控制的時候為什麼總是那麼鬱悶了，原來，js 在對於readonly、disabled等屬性設定時，有一個小bug（至少我是這麼認為）：首先，document.getElementById("id").readonly = "true"; 設定input為唯讀，但是，當透過document.getElementById("id").readonly="false" 來去掉唯讀屬性時，沒有作用，此時，需要把 false 外面的引號給去掉js語句才能正常運作。

附：

1. jquery 透過id屬性設定與取消唯讀屬性

設定唯讀：$("#id").attr("readOnly","true");

取消唯讀：$("#id"). attr("readOnly",false);

2. jquery 批次設定與取消唯讀屬性

/* id為sa的p中，所有input方塊 */

#設定唯讀：$("#sa input").attr("readOnly","true");

#取消唯讀：$("#sa input").attr(" readOnly",false);

相關文章：

js設定input文字方塊唯讀

##透過js設定所有form物件為只讀

處理表單使input等文字方塊為只讀不可編輯的方法

以上是使用js動態控制input框的唯讀屬性的詳細內容。更多資訊請關注PHP中文網其他相關文章！