js登录界面判断输入的用户名和密码是否为空

最新推荐文章于 2024-07-12 10:31:37 发布

ImSe7en

最新推荐文章于 2024-07-12 10:31:37 发布

阅读量1.2w

点赞数 3

分类专栏：常用代码

本文链接：https://blog.csdn.net/ImSe7en/article/details/51554774

版权

常用代码专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
//检查用户名和密码是否为空
function check(){
var username= document.getElementById("username");
if(username.value.trim()==""){//没有输入用户名是显示提示
//获取所有子节点
var findNodes = document.getElementById("name").children;
if(findNodes.length==0){//只添加一次span
var appdom= document.createElement("span");
appdom.innerHTML="*用户名不能为空";
appdom.style.color="red";
document.getElementById("name").appendChild(appdom);
}
return false;
}else{//输入了内容后清除节点内容
var findNodes =document.getElementById("name").children;
if(findNodes.length>0){
document.getElementById("name").removeChild(findNodes[0]);
}
}
var userpwd = document.getElementById("userpwd");
if(userpwd.value.trim()==""){
var findNodes2 = document.getElementById("pwd").children;
if(findNodes2.length==0){
var appdom2 = document.createElement("span");
appdom2.innerHTML="*密码不能为空";
appdom2.style.color="red";
document.getElementById("pwd").appendChild(appdom2);
}
return false;
}else{
var findNodes2 = document.getElementById("pwd").children;
if(findNodes2.length>0){
document.getElementById("pwd").removeChild(findNodes2[0]);
}
}
}
</script>
</head>
<body>
<form name="form1">
用户名：<input type="text" name="username" id="username"/><em id="name"></em><br>
密码：<input type="password" name="userpwd" id="userpwd"><em id="pwd"></em><br>
<input type="submit" value="登录" οnclick="return check();">
</form>

</body>
</html>

ImSe7en

关注

3
点赞
踩
14

收藏

觉得还不错? 一键收藏
0
评论
js登录界面判断输入的用户名和密码是否为空

//检查用户名和密码是否为空 function check(){ var username= document.getElementById("username"); if(username.value.trim()==""){//没有输入用户名是显示提示 //获取所有子节点
复制链接

扫一扫