实现效果:当鼠标点到文本框的时候,在文本框的后面给我们一段提示。当光标离开的时候完成校验。将信息写到文本框的后面的位置。
使用到的JS中的事件:
onfocus:获得焦点
onblur:失去焦点
JS控制向HTML的某个元素中写入内容:
document.getElementById("").innnerHTML="";
代码实现:
<script>
function checkForm(){
var flag=true;
var usernameValue=document.getElementById("username").value;
var passwordValue=document.getElementById("password").value;
if(usernameValue==null||usernameValue=="")
{
//若为空,在span中添加错误信息
//获取span
var username_msgObj=document.getElementById("username_msg");
//设置错误信息
username_msgObj.innerHTML="<font color='red'>"用户名不能为空</font>";
flag=false;
}else{
//如果不为空则不显示信息
var username_msgObj=document.getElementById("username_msg");
username_msgObj.innerHTML="";
}
if(passwordValue == null || passwordValue== ""){
//若为空 在span中添加错误信息
//获取span
var password_msgObj=document.getElementById("password_msg");
//设置错误信息
password_msgObj.innerHTML="密码不能为空";
password_msgObj.style.color="red";
//将flag置为false;
flag=false;
}else{
//如果不为空则不显示信息
var username_msgObj=document.getElementById("username_msg");
username_msgObj.innerHTML="";
}
return flag;
}
</script>