关闭

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

158人阅读 评论(0) 收藏 举报
分类:
<!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

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:29976次
    • 积分:1144
    • 等级:
    • 排名:千里之外
    • 原创:83篇
    • 转载:19篇
    • 译文:2篇
    • 评论:0条
    文章分类