HTML中表单Input文本框只读不可修改的代码

在网页设计中，有的表单是不想让用户修改的，这样的文本框可以变成灰色，那么可以让HTML中的INPUT属性变灰色的代码是什么呢，本文就为大家介绍一下！

让用户不能修改其中的信息，比如：<input type="text" name="input1" value="最火下载站veryhuo.com"> 的内容，"最火下载站veryhuo.com"两个字不可以修改。实现的方式归纳一下，有如下几种。

方法1: onfocus=this.blur() 当鼠标放不上就离开焦点
<input type="text" name="input1" value="最火下载站veryhuo.com" onfocus=this.blur()>

方法2:readonly
<input type="text" name="input1" value="最火下载站veryhuo.com" readonly>
<input type="text" name="input1" value="最火下载站veryhuo.com" readonly="true">

方法3: disabled
<input type="text" name="input1" value="最火下载站veryhuo.com" 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" /> <div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>
提示：可修改后代码再运行!

disabled="true" 此果文字会变成灰色，不可编辑。
readOnly="true" 文字不会变色，也是不可编辑的

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

有两种方法第一：disabled="disabled"这样定义之后被禁用的 input 元素既不可用，也不可点击。第二：readonly="readonly" 只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本；

（编辑：济源站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!