用HTML和JS做简单的注册验证

来源：互联网发布：个性化排序算法编辑：程序博客网时间：2024/04/20 17:05
题目如下：
初学web，主要熟悉一下javascript和简单正则表达式的用法。
<!--To change this template, choose Tools | Templatesand open the template in the editor.--><!DOCTYPE html><html>    <head>        <title></title>        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">        <script type="text/javascript">            function validate(){                var flag=1;                if(!/^\d+$/.test(document.emp.empno.value))                    {                        document.getElementById("errorno").innerHTML="<font color='red'>雇员编号必须是数字</font>";                        document.emp.empno.focus();                        document.emp.empno.select();                        flag=0;                    }                 if(!/^\S+$/.test(document.emp.empname.value))                    {                        document.getElementById("errorname").innerHTML="<font color='red'>雇员姓名不能为空</font>";                        document.emp.empname.focus();                        document.emp.empname.select();                        flag=0;                    }                if(!/^\S+$/.test(document.emp.empjob.value))                    {                        document.getElementById("errorjob").innerHTML="<font color='red'>雇员工作不能为空</font>";                        document.emp.empjob.focus();                        document.emp.empjob.select();                        flag=0;                    }                if(!/^\d{4}-\d{2}-\d{2}$/.test(document.emp.emphiredate.value))                    {                        document.getElementById("errorhiredate").innerHTML="<font color='red'>雇佣日期格式必须为xxxx-xx-xx,如2013-11-11</font>";                        document.emp.emphiredate.focus();                        document.emp.emphiredate.select();                        flag=0;                    }                if(!/^\d*[.]?\d+$/.test(document.emp.empsalary.value))                    {                        document.getElementById("errorsalary").innerHTML="<font color='red'>雇员工资必须是数字(小数)</font>";                        document.emp.empsalary.focus();                        document.emp.empsalary.select();                        flag=0;                    }                if(!/^\d*[.]?\d+$/.test(document.emp.empbonus.value))                   {                        document.getElementById("errorbonus").innerHTML="<font color='red'>雇员奖金必须是数字(小数)</font>";                        document.emp.empbonus.focus();                        document.emp.empbonus.select();                        flag=0;                   }                 if(flag==0)return false;                 else return true;            }        </script>    </head>    <body>            <form name="emp" method="post" action="index.jsp"  onsubmit="return validate()">            雇员编号：<input type="text" name="empno" />            <span id="errorno"></span><br />            雇员姓名：<input type="text" name="empname" />            <span id="errorname"></span><br />            雇员工作：<input type="text" name="empjob" />            <span id="errorjob"></span><br />            雇佣日期：<input type="text" name="emphiredate" />            <span id="errorhiredate"></span><br />            雇员工资：<input type="text" name="empsalary" />            <span id="errorsalary"></span><br />            雇员奖金：<input type="text" name="empbonus" />            <span id="errorbonus"></span><br />            <input type="submit" value="提交">            <input type="reset" value="重置">                    </form>        </body></html>