form表单

今天介绍一下form表单

<form action="" >
  邮箱: <input type="text" id="email"><br>
  密码: <input type="password" id="pwd"><br>
  <input type="submit" value="登录">
</form>

思路：action 数据提交的地址
只有当onsubmit 返回为true才会跳转
什么时候验证 事件？
点击登录验证submit 表单失去焦点验证 blur

function yanzhen(){
            return checkEmail()&&checkPwd();
        }
        var email = document.getElementById("email");
        
          // 获取email
        var pwd = document.getElementById("pwd");

    // 获取密码框
        email.onblur = checkEmail;
        // 当email失去焦点时候检测邮箱
        pwd.onblur = checkPwd;
        // 当pwd失去焦点时候检测密码
        
        function checkEmail(){
            var val = email.value;
            //获取邮箱的值;
            if(val.length<=0){
                alert("邮箱不能为空");
                return false;
            }
            // 邮箱必须 有@
            if(val.indexOf("@")==-1){
                alert("小哥哥，邮箱的有个@吧！");
                return false;
            }
            return true;
             
        }
        function checkPwd(){
            var val = pwd.value;
            // 获取密码的值
            if(val.length<6){
                alert("密码必须大于6位");
                return false;
            }
            return true;
        }

注意：input：onblur 失去光标事件
value表单的值