标签:color col 隐藏 set query focus === document his
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style type="text/css">
input{ color: #999; outline: none;}
</style>
</head>
<body>
<div>
<input type="text" value="手机" />
</div>
<script>
//1. 获取元素
var text = document.querySelector("input");
//2. 注册事件 获得焦点 onfocus
text.onfocus = function() {
if(this.value ==="手机") {
this.value = "";
}
// 获得焦点需要把文本框里面的文字颜色变黑
this.style.color = "#000";
}
//3. 注册事件 失去焦点事件 onblur
text.onblur = function() {
if(this.value ===""){
this.value = "手机";
// 失去焦点需要把文本框里面的文字颜色变浅色
this.style.color = "#999";
}
}
</script>
</body>
</html>
标签:color col 隐藏 set query focus === document his
原文地址:https://www.cnblogs.com/XiaoJun6/p/13093803.html