input 標籤的 disabled 和 readonly 屬性

首先這兩種屬性都會使顯示出來的文本框不能輸入。

 

　　disabled 屬性：規定禁用 input 元素。被禁用的 input 元素既不可用，也不可點擊和編輯，使用 tab 鍵時將會被跳過，用戶的全部操做對該輸入項都無效。會使文本框變灰。

　　此屬性對全部的表單元素都有效，可是表單元素在使用了 disabled 後，當咱們將表單以 POST 或 GET 的方式提交的話，這個表單元素值不會被提取，也不會被提交。

注意：disabled 屬性沒法與 <input type="hidden"> 一塊兒使用。

 

　　readonly 屬性：規定輸入字段爲只讀。此時咱們不能編輯對應的文本，但能夠聚焦焦點或使用 tab 鍵切換到該字段，還能夠選中或拷貝其文本。外觀沒有變化。

　　只對文本輸入框有效 ( input: text / password  和 textarea ）。表單元素的 value 值仍能提取，在提交表單的時候，也會被提交。

 

經常使用狀況：

1. 某個表單不容許用戶改動，可是在提交時須要傳遞該值，此時應該將它的屬性設置爲 readonly 。
2. 在用戶點擊提交按鈕後，防止用戶反覆點擊提交按鈕致使數據重複屢次存入數據庫，能夠利用 js 將按鈕 disabled。