表单验证

非空验证，验证用户输入的内容不为空或者空格

<input type="text"/ id="txt">
    <script type="text/javascript">
        var txt = document.getElementById("txt");
        txt.onblur = function()
        {
            if(txt.value.trim()=="")//为空且去除空格
            {
                alert("请输入用户名");
            }
        }
    </script>

 

　　

相等验证，验证用户输入的两个框体的内容是否相同

<input type="password" id="psw1"/>
    <input type="password" id="psw2"/>
    <script type="text/javascript">
        var psw1 = document.getElementById("psw1");
        var psw2 = document.getElementById("psw2");
        psw2.onblur = function()
        {
            if(psw1.value==psw2.value)
            {
                alert("正确");
            }
            else
            {
                alert("两次输入的密码不相同");
            }
        }   
    </script>

 

 

范围验证，验证用户输入的内容是否在允许范围之内

<input type="text"/ id="age">
    <script type="text/javascript">
        var age = document.getElementById("age");
        age.onblur = function()
        {
            if(age.value>=18)
            {
                alert("通过");
            }
            else
            {
                alert("没有达到要求的年龄");
            }
        }
    </script>

 

 

正则验证，运用正则表达式验证用户输入的内容是否符合必要的格式，以邮箱验证为例

<input type="text"/ id="email">
    <script type="text/javascript">
        var email = document.getElementById("email");
        email.onblur = function()
        {
            var zhz = /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/;
            if(email.value.match(zhz)==null)//match方法内写正则表达式，符合会返回符合的内容，不符合会返回null
            {
                alert("请输入有效的邮箱")
            }
        }
    </script>