用html编写用户注册程序,要求用户选择页面中的文本框时,改变文本框的背景颜色,当选择其他文本框时,将失去焦点的文本框背景颜色恢复原始状态。
时间: 2024-03-22 14:37:42 浏览: 54
可以通过JavaScript来实现这个功能。以下是一个示例代码:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户注册程序</title>
<script type="text/javascript">
function changeBgColor(obj) {
// 恢复其他文本框的背景颜色
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
if (inputs[i] != obj) {
inputs[i].style.backgroundColor = "#fff";
}
}
// 改变当前文本框的背景颜色
obj.style.backgroundColor = "#f0f0f0";
}
</script>
</head>
<body>
<form>
<label for="username">用户名:</label>
<input type="text" id="username" name="username" onfocus="changeBgColor(this)">
<br>
<label for="password">密码:</label>
<input type="password" id="password" name="password" onfocus="changeBgColor(this)">
<br>
<label for="email">邮箱:</label>
<input type="email" id="email" name="email" onfocus="changeBgColor(this)">
<br>
<input type="submit" value="注册">
</form>
</body>
</html>
```
当用户点击任意一个文本框时,会触发`changeBgColor()`函数,函数会先恢复其他文本框的背景颜色,再改变当前文本框的背景颜色。其中`onfocus`属性用于指定文本框获取焦点时要执行的函数。
阅读全文