首页 > 代码库 > 使用js设置input标签只读 readonly 属性
使用js设置input标签只读 readonly 属性
先上代码：
<html>
<head>
<title> test </title>
<meta charset="utf-8">
</head>
<script language="JavaScript">
function setReadonly() {
//document.getElementById("test").setAttribute("readOnly", true);
document.getElementById("test").readOnly=true;
}
function readWrite() {
//document.getElementById("test").setAttribute("readOnly", false);
document.getElementById("test").readOnly=false;
}
</script>
<body>
<form name="addform" id="addform" method="post" action="">
<input type="text" id="test" >
<input type="button" value="http://www.mamicode.com/只读" onclick="setReadonly();">
<input type="button" value="http://www.mamicode.com/读写" onclick="readWrite();">
</form>
</body>
</html>
代码挺简单的，但是这一点代码也有可能达不到预期效果。
一开始，在readWrite()函数中，我用的是注释掉的那些代码，没有用红色部分代码，结果点击“读写”按钮后，还是不可编辑。于是就改成了红色部分代码，结果再点击“读写”按钮就可以编辑了。
总结了一下，当达不到预期效果时，可以使用以下几种解决方案：
1、readonly中 将‘o’改为大写‘O’ ，即将readonly改为readOnly ；
2、将上述代码中的setReadonly()和readWrite()函数中设置readOnly读写属性的那些代码组合着全试一遍，基本就能达到预期效果了。
使用js设置input标签只读 readonly 属性
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。