首頁  >  文章  >  web前端  >  使用js動態控制input框的唯讀屬性

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

阿神
阿神原創
2017-03-18 11:23:242018瀏覽

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中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn