HTML中讓表單input等文字框為唯讀不可編輯的方法

標籤：文字   文字框   value   input   不可編輯   class   his   dex   欄位   

有時候，我們希望表單中的文字框是唯讀，讓使用者不能修改其中的資訊，如使<input type="text" name="input1" value="中國"> 的內容，"中國"兩個字不可以修改。實現的方式歸納一下，有如下幾種。 

方法1: onfocus=this.blur() 當滑鼠放不上就離開焦點
<input type="text" name="input1" value="中國" onfocus=this.blur()> 

方法2:readonly 
<input type="text" name="input1" value="中國" readonly> 
<input type="text" name="input1" value="中國" readonly="true"> 

方法3: disabled 
<input type="text" name="input1" value="中國" disabled="true">

完整的例子:

<input name="ly_qq" type="text" tabindex="2" onMouseOver="this.className=‘input_1‘" onMouseOut="this.className=‘input_2‘" value="123456789" disabled="true"　readOnly="true" /> 

disabled="true" 此果文字會變成灰色，不可編輯。 
readOnly="true" 文字不會變色，也是不可編輯的

css屏蔽輸入：<input style="ime-mode: disabled"> 

有兩種方法第一：disabled="disabled"這樣定義之後被禁用的 input 元素既不可用，也不可點擊。第二：readonly="readonly" 唯讀欄位是不能修改的。不過，使用者仍然可以使用 tab 鍵切換到該欄位，還可以選中或拷貝其文本；

 

HTML中讓表單input等文字框為唯讀不可編輯的方法