DOM验证文本框为空则文本框为红丝，否则为白色

最新推荐文章于 2021-06-03 09:29:51 发布

胖胖爱家

最新推荐文章于 2021-06-03 09:29:51 发布

阅读量595

点赞数

分类专栏： js / jq / vue 文章标签： input xhtml function html 文档

本文链接：https://blog.csdn.net/yual365/article/details/6784048

版权

js / jq / vue 专栏收录该内容

85 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>演示文档</title>
<script type="text/javascript">
function initEvent(){ //便利所有input空间，添加onblur响应函数
var inputs = document.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++){
var input = inputs[i];
input.onblur = inputOnBlur;//设置inputOnBlur函数为input元素的onblur事件的响应函数
}
}
function inputOnBlur(){ //焦点失去时进行数据检查
if(this.value.length<=0){ //检查文本框内容长度，如果小于0说明为空则变红
this.style.background = "red";
}else{
this.style.background = "while";
}

}
</script>
</head>
<body οnlοad="initEvent()">
<input type="text" /><input type="text" />
<input type="text" /><input type="text" />
<input type="text" /><input type="text" />

</body>
</html>