js控制input框只读实现示例

230 阅读 0 评论 152 点赞

我是靠谱客的博主直率石头，这篇文章主要介绍js控制input框只读实现示例，现在分享给大家，希望可以做个参考。

复制代码代码如下:

 
<html> 
<head> 
<title> New Document </title> 
<meta name="Generator" content="EditPlus"> 
<meta name="Author" content=""> 
<meta name="Keywords" content=""> 
<meta name="Description" content=""> 
</head> 
<script language="JavaScript"> 
function isreadonly(){ 
var obj = document.getElementById("username"); 
obj.setAttribute("readOnly",true); 
obj.style.backgroundColor="#d2d2d2"; 
} 
function readwrite(){ 
var obj = document.getElementById("username"); 
obj.setAttribute("readOnly",false); 
obj.style.backgroundColor="#ffffff"; 
} 
</script> 
<body> 
<form name="addform" id="addform" method="post" action="" > 
<input type="text" id="username" name="username"> 
<input type="button" name="只读" value="read" onclick="isreadonly();"> 
<input type="button" name="可写" value="write" onclick="readwrite();"> 
</form> 
</body> 
</html> 
<!-- 
点击“read”按钮，input框不能书写，且变灰；点击“write”按钮，input框恢复。 
--> 