设置HTML表单文本框为只读的几种方式
有时候，我们希望表单中的文本框是只读的，让用户只能查看信息而不能修改其中的信息。比如，我们想让
input type="text" name="input" value="HTML" 的内容中
value 的值，就是
HTML 不可以修改。实现的方式有以下几种。
- 方法一：修改
onfocus 参数为 this.blur()
- 方法二：添加
readonly 参数
- 方法三：添加
disabled 参数
jQuery将text文本框设置为只读
使用jQuery，你可以这样设置文本框为只读：
$("#c_price").attr("readonly",true);
CSS控制文本框的只读属性的方法
你可以通过CSS来封装整个只读文本框的属性，比如：
.TextBoxReadOnly {
border:1px solid #C0C0C0;
text-align:left;
background-color:#D3D3D3;
width:100px;
readonly:expression(this.readOnly=true);
}
需要注意的是，一旦使用CSS修饰了该控件使它只读，就不能再使它恢复到可读写的状态了。不过，你可以通过以下方式来回切换只读与可读写状态：
.TextBoxReadWrite {
border:1px solid #C0C0C0;
text-align:left;
background-color:#FFFFFF;
width:100px;
readonly:expression(this.readOnly=false);
}
切换的JavaScript函数：
function f1(ctr,isReadOnly) {
var octr = document.getElementById(ctr);
if(octr != null) {
if(isReadOnly)
octr.className = "TextBoxReadOnly";
else
octr.className = "TextBoxReadWrite";
}
}
调用函数：
function f3() {
f1("",true);
}
小结与拓展
以上就是设置HTML文本框只读属性的方法，希望对你有所帮助。如果你对相关技术还有更多疑问，欢迎访问「极星编程网」（www.jxgpc.com）了解更多内容。我是苏承栈，我们下期再见！
