readonly 和 disable的區(qū)別

Readonly和Disabled 兩種屬性的寫法如下:
1贿讹、<input type="text" name="name" value="xxx" readonly="true"/>
2、<input type="text" name="name" value="xxx" disabled="true"/>

共同點:

如果設(shè)為true够掠,則form屬性將不能被編輯民褂,文本框不能輸入文字。

區(qū)別:

1疯潭、樣式不同赊堪。
readonly只是使文本框不能輸入,外觀沒有變化袁勺。
disabled會使文本框變灰雹食。

2、有效范圍不同期丰。
readonly只針對input(text / password)和textarea之類可以輸入文本的輸入項有效群叶。
disabled對于所有的表單元素都有效。

3钝荡、是否能獲取鼠標(biāo)焦點街立。
readonly設(shè)為true,用戶不能編輯埠通,但鼠標(biāo)仍然可以聚焦赎离。
disabled設(shè)為true,輸入項不能獲取焦點端辱,用戶的所有操作(鼠標(biāo)點擊梁剔、鍵盤輸入等)對該輸入項都無效虽画。

4、是否回傳數(shù)據(jù)荣病。
表單元素使用了readonly后码撰,會將該值傳遞出去,即通過request.getParameter("name")可以得到文本框內(nèi)的內(nèi)容个盆。
表單元素使用了disabled后脖岛,當(dāng)我們將表單以POST或GET的方式提交的話,這個元素的值不會被傳遞出去颊亮,即通過request.getParameter("name")得不到文本框中的內(nèi)容(如果有的話)柴梆。

比較常見的情況如下所述。

情況一:

在某個表單中為用戶預(yù)填了某個唯一識別代碼终惑,不允許用戶改動绍在,但是在提交表單時作為form提交這項值——此時應(yīng)該將它的屬性設(shè)置為readonly 。

情況二:

當(dāng)用戶正式提交了表單后需要等待管理員的信息驗證雹有,這就不允許用戶再更改表單中的數(shù)據(jù)揣苏,而是只能夠查看——由于disabled的作用元素范圍大,所以此時應(yīng)該使用disabled件舵。同時,應(yīng)該注意的是要將submit button也disabled掉脯厨,否則只要用戶按了這個按鈕铅祸,如果在數(shù)據(jù)庫操作頁面中沒有做完整性檢測的話,數(shù)據(jù)庫中的值就會被清除合武。
如果說在這種情況下用readonly來代替disabled临梗,若表單中只有input(text / password)和textarea元素,那還是可以的稼跳;
如果存在其他元素盟庞,比如select,readonly屬性對它們無效汤善,用戶可以在重新改寫值后按回車鍵進(jìn)行提交(回車是默認(rèn)的submit觸發(fā)按鍵)什猖。
所以,我們常常在用戶按了提交按鈕后红淡,利用javascript將提交按鈕disabled掉不狮,這樣可以防止網(wǎng)絡(luò)條件比較差的環(huán)境下,用戶反復(fù)點提交按鈕導(dǎo)致數(shù)據(jù)冗余地存入數(shù)據(jù)庫在旱。

編輯:栗子六壹
參考:https://blog.csdn.net/zxf1242652895/article/details/78517931?utm_source=copy

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末摇零,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子桶蝎,更是在濱河造成了極大的恐慌驻仅,老刑警劉巖谅畅,帶你破解...
    沈念sama閱讀 219,539評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異噪服,居然都是意外死亡毡泻,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,594評論 3 396
  • 文/潘曉璐 我一進(jìn)店門芯咧,熙熙樓的掌柜王于貴愁眉苦臉地迎上來牙捉,“玉大人,你說我怎么就攤上這事敬飒⌒安” “怎么了?”我有些...
    開封第一講書人閱讀 165,871評論 0 356
  • 文/不壞的土叔 我叫張陵无拗,是天一觀的道長带到。 經(jīng)常有香客問我,道長英染,這世上最難降的妖魔是什么揽惹? 我笑而不...
    開封第一講書人閱讀 58,963評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮四康,結(jié)果婚禮上搪搏,老公的妹妹穿的比我還像新娘。我一直安慰自己闪金,他們只是感情好疯溺,可當(dāng)我...
    茶點故事閱讀 67,984評論 6 393
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著哎垦,像睡著了一般囱嫩。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上漏设,一...
    開封第一講書人閱讀 51,763評論 1 307
  • 那天墨闲,我揣著相機(jī)與錄音,去河邊找鬼郑口。 笑死鸳碧,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的潘酗。 我是一名探鬼主播杆兵,決...
    沈念sama閱讀 40,468評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼仔夺!你這毒婦竟也來了琐脏?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,357評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎日裙,沒想到半個月后吹艇,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,850評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡昂拂,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,002評論 3 338
  • 正文 我和宋清朗相戀三年受神,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片格侯。...
    茶點故事閱讀 40,144評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡鼻听,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出联四,到底是詐尸還是另有隱情撑碴,我是刑警寧澤,帶...
    沈念sama閱讀 35,823評論 5 346
  • 正文 年R本政府宣布朝墩,位于F島的核電站醉拓,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏收苏。R本人自食惡果不足惜亿卤,卻給世界環(huán)境...
    茶點故事閱讀 41,483評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望鹿霸。 院中可真熱鬧排吴,春花似錦、人聲如沸懦鼠。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,026評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽葛闷。三九已至,卻和暖如春双藕,著一層夾襖步出監(jiān)牢的瞬間淑趾,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,150評論 1 272
  • 我被黑心中介騙來泰國打工忧陪, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留扣泊,地道東北人。 一個月前我還...
    沈念sama閱讀 48,415評論 3 373
  • 正文 我出身青樓嘶摊,卻偏偏與公主長得像延蟹,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子叶堆,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,092評論 2 355

推薦閱讀更多精彩內(nèi)容

  • ??JavaScript 最初的一個應(yīng)用,就是分擔(dān)服務(wù)器處理表單的責(zé)任沥匈,打破處處依賴服務(wù)器的局面蔗喂。 ??盡管目前的...
    霜天曉閱讀 668評論 0 3
  • 1、通過CocoaPods安裝項目名稱項目信息 AFNetworking網(wǎng)絡(luò)請求組件 FMDB本地數(shù)據(jù)庫組件 SD...
    陽明先生_X自主閱讀 15,982評論 3 119
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5高帖? 答:HTML5是最新的HTML標(biāo)準(zhǔn)缰儿。 注意:講述HT...
    kismetajun閱讀 27,490評論 1 45
  • HTML 5 HTML5概述 因特網(wǎng)上的信息是以網(wǎng)頁的形式展示給用戶的,因此網(wǎng)頁是網(wǎng)絡(luò)信息傳遞的載體散址。網(wǎng)頁文件是用...
    阿啊阿吖丁閱讀 3,899評論 0 0
  • 2018年3月1日婠婠正式開始上幼兒園~ 因為還沒上班乖阵,第一天陪她一起上幼兒園。婠婠還是睡到自然醒的作息预麸,起...
    chenwan閱讀 576評論 0 3