JavaScript 表单验证

标签 javascript jsp validation

我正在 JSP 中进行一些表单验证,单击提交按钮时“validate_access()”函数未调用或不起作用。有时此函数会显示一个警报框,然后停止执行任何操作。请告诉这段代码有什么问题。这是一段代码:

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Data management system</title>

    <script language="JavaScript" type="text/javascript">

            function validate_access()
        {
              var a = document.forms["myForm1"]["MISDN"].value;
              var b = document.forms["myForm1"]["Issue"].value;
              var c = document.forms["myForm1"]["SR"].value;
              var d = document.forms["myForm1"]["date"].value;
              var numbers = /^[0-9]+$/;
              var alpha= /^[a-zA-Z]+$/;
              var Datee= /^\d{1, 2}\/\d{1, 2}\/\d{4}$/;
            if(document.myform1.MISDN.value=="" && document.myform1.Issue.value=="" && document.myform1.SR.value=="" && document.myform1.date.value=="")
            {
              alert("Manadotry fields should not left blank");
              document.myform1.MISDN.focus();
              document.myform1.Issue.focus();
              document.myform1.SR.focus();
              document.myform1.date.focus();
              return false;
            }
            else if(!a.value.match(numbers))
            {
                 alert('Please input numeric characters only');  
                 document.myform1.MISDN.focus();
                 return false;
            }
            else if(!(b.value.match(numbers) && b.value.match(alpha)))   
            {  
                  alert('Please input numeric and alphabets only');  
                  document.myform1.Issue.focus();
                  return false; 
            }  
            else if(!c.value.match(numbers))  
            {
                  alert('Please input numeric characters only');  
                  document.myform1.SR.focus();
                  return false;

            }
            else if(!d.value.match(Datee))
            {
                  alert('Please input correct date');  
                  document.myform1.date.focus();
                  return false;
            }
            else
                return true;


        }


    </script>
</head>
<body>
 <div class="main">
     <div class="header"></div>
     <div class="continer">
         <div class="myform1" style="height:200px; width:300px; float:left;">
            <h2>1344 Access</h2>
            <form name="myform1" action="access.jsp" method="get" onsubmit="return validate_access()">
                <br/>MSISDN:<input type="text" name="MISDN" maxlength="11">
                <br/>Issue:<input type="text" name="Issue" maxlength="13">
                <br/>SR:<input type="text" name="SR">
                <br/>Date:<input type="text" name="date" value="dd/mm/yy">
                <br/><input type="submit" value="Submit">
                <br/><input type="reset" name="Reset">

            </form>
        </div>
        <div class="myform2" style="float:left;height:200px; width:300px;">
            <h2>O.C.S</h2>
            <form name="myform2" action="ocs.jsp" method="post" onsubmit="return validate_ocs()">
                <br/>MSISDN:<input type="text" name="MISDN" maxlength="11">
                <br/>SR:<input type="text" name="SR">
                <br/>REASON:<input type="text" name="reason">
                <br/><input type="submit" value="Submit">
                <br/><input type="reset" name="Reset">
            </form>
        </div>    
     </div>
 </div>



</body>

最佳答案

您的 JavaScript 中的问题是:

  • 第一个 if 条件检查错误,您的意思是用 || 代替 &&

  • 接下来,当您对空字符串调用 match 方法时,可能会引发如下错误:

    未捕获类型错误:无法读取未定义的属性“匹配”

  • 连续调用 .focus() 没有任何意义,请调用一次并进行条件检查。

关于JavaScript 表单验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25725395/

相关文章:

apache - 内网无法访问虚拟主机

validation - 将 Symfony UniqueEntity 与 Doctrine 结合使用

validation - asp.net mvc 3 在模型上运行验证

javascript - 在弹出窗口处于事件状态时禁用滚动

javascript - Google 自定义搜索 - getElement 为 null - 无法访问 <gcse :. ..> 元素

java - 在 Javascript 中动态设置复选框

javascript - 有没有办法只接受字母而不接受数字作为输入?如果给出数字,它应该显示验证错误,因为它只需要字母

javascript - 如何使用 javascript 函数从 3 个日期中查找最小日期?

javascript - 先锚定标签href,然后onclick

java - Google App Engine - 如何将对象返回到我的 servlet?