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

原创 2016年06月01日 11:38:40
<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="登录" onclick="return check();">
     </form>


</body>
</html>

相关文章推荐

JS实现简单的登录界面(不连接数据库,把用户名密码写死)

今天做项目的时候碰到这个问题, 看上去很简单写个js函数就行了, 实际好像没那么好操作, 用window.location.href=""行不通呀, 得用window.document.f.a...

JAVA J2SE SWING AWT 登录界面 输入用户名和密码 登录器

import java.awt.BorderLayout; import java.awt.GridLayout; import java.awt.event.ActionEvent; impo...

登录界面—记住用户名和密码

每次登录都需要输入完整的帐号与密码,那么可以设置记住密码,再次登录一点即可! 代码如下: 第一部分:文本框 form id="login" name="login" action="login" ...

Android实现登录界面记住用户名与密码

通过SharedPreference的配置文件的键值对的存储方式保存用户名密码。 登录界面activity每次登录的时候都从配置文件中获取用户名和密码。 即,CheckBox勾选时,存入用户名密码...

登录界面中密码与用户名的保存

1.谈到保存就不能不说SharedPreferences类。   1)SharedPreferences是Android平台上一个轻量级的数据存储方式,通常用来存储一些简单的配置信息,例如用户名,密...

centos6.6输入正确用户名和密码仍跳回登录界面

1)CentOS自动更新到6.5后root无法登陆问题解决 实验室CentOS服务器不知道被谁更新系统到6.5后,发现在本机上即使输入正确的密码也无法登陆,通过在google搜索,发现有一些...

登录界面如何实现记住用户名和密码 且实现自动登录

最近在一次练习中遇到了一个问题,如何在登录界面实现记住用户名和密码,并且可以进行勾选是否自动登录。 首先,给大家看下我的登陆界面。 很显然,我布置了checkbox...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:js判断登录界面用户名和密码是否为空
举报原因:
原因补充:

(最多只允许输入30个字)