老师帮忙看下可以吗
来源:3-8 编程练习
Clover丶三叶草
2019-08-02 11:27:19
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>onblur和onfocus</title>
<style type="text/css">
.red{
border:1px solid red;
}
span{
display:none;
}
.borderred{
border-color:red;
}
</style>
</head>
<body>
姓名:<input type="text"> <span>请输入您的姓名</span>
<script type="text/javascript">
// 补充代码
var input=document.getElementsByTagName("input")[0];
var span=document.getElementsByTagName("span")[0];
input.onfocus=function(){
if(input.value==""){
span.style.display="block";
}
}
input.onblur=function(){
if(input.value==""){
span.innerHTML="用户名不能为空";
input.className="borderred";
}else{
span.innerHTML="";
input.className="";
}
}
</script>
</body>
</html>
1回答
好帮手慕码
2019-08-02
同学你好!
当聚焦没有输入内容,失去焦点后再次聚焦, 输入框红色和蓝色重合了:

可以在聚焦的时候先清除类名:

如果帮助到了你 欢迎采纳 祝学习愉快~
相似问题