点评:有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,本文整理了多种实现方法,感兴趣的朋友可以参考下
方法一: <input id= "File1" type= "text" disabled/> 不可用
AvvHTML5中文学习网 - HTML5先行者学习网方法二: <input id= "File1" type= "text" readonly/> 只读
AvvHTML5中文学习网 - HTML5先行者学习网方法三: <input id= "File1" type= "text" style="display:none"/> 隐藏(但占位置)
AvvHTML5中文学习网 - HTML5先行者学习网方法四: <input id= "File1" type= "text" style="visibility:hidden"/> 隐藏(不占位置)
AvvHTML5中文学习网 - HTML5先行者学习网AvvHTML5中文学习网 - HTML5先行者学习网有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使<input type="text" name="input1" value="中国"> 的内容,"中国"两个字不可以修改。实现的方式归纳一下,有如下几种。
AvvHTML5中文学习网 - HTML5先行者学习网AvvHTML5中文学习网 - HTML5先行者学习网方法1: onfocus=this.blur()
AvvHTML5中文学习网 - HTML5先行者学习网 AvvHTML5中文学习网 - HTML5先行者学习网
<input type="text" name="input1" value="中国" onfocus=this.blur()> AvvHTML5中文学习网 - HTML5先行者学习网
AvvHTML5中文学习网 - HTML5先行者学习网方法2:readonly
AvvHTML5中文学习网 - HTML5先行者学习网 AvvHTML5中文学习网 - HTML5先行者学习网
<input type="text" name="input1" value="中国" readonly> AvvHTML5中文学习网 - HTML5先行者学习网
<input type="text" name="input1" value="中国" readonly="true"> AvvHTML5中文学习网 - HTML5先行者学习网
AvvHTML5中文学习网 - HTML5先行者学习网方法3: disabled
AvvHTML5中文学习网 - HTML5先行者学习网 AvvHTML5中文学习网 - HTML5先行者学习网
<input type="text" name="input1" value="中国" disabled> AvvHTML5中文学习网 - HTML5先行者学习网