DOM-----用户名密码不能为空

来源：互联网发布：电脑分区数据恢复编辑：程序博客网时间：2024/05/17 02:00

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
function login()
{
var node =document.getElementById("info1").children;//清空span
for(var i=0;i<node.length;i++)//如果length>0 代表里面有元素就不用添加了
{
document.getElementById("info1").removeChild(node[i]);
}

var log =document.getElementById("text1").value;//获得text里面的字符

if(log.trim()=="")//如果为空
{
var words =document.createElement("span");//创建元素span
words.style.color="red";//字体颜色为红
words.innerHTML="用户名不能为空";
document.getElementById("info1").appendChild(words);//em元素添加该span元素作为子元素
return false;//返回false
}
else
{
return true;
}

}
function pwd()
{
var pwd =document.getElementById("text2").value;
if(pwd.trim()=="")
{
if(document.getElementById("info2").children.length<=0)
{
var img =document.createElement("img");

img.setAttribute("src", "2.jpg");
document.getElementById("info2").appendChild(img);
}
}
else
{

if(document.getElementById("info2").children.length>=1)
{
document.getElementById("info2").removeChild(document.getElementById("info2").children[0]);
}

}

}
window.onload=function()
{
setInterval("pwd()",100);
}
</script>
</head>
<body>
<form name="form1">
用户名：<input type="text" id="text1"><em id="info1"></em><br>
密码：<input type="text" id="text2"><em id="info2"></em><br>
<input type="submit" value="确定" onclick=" return login();">//如果click是返回false 则无法提交和刷新或者跳转页面
</form>
</body>
</html>

0 0