Question

我想验证我的表单。我在我的代码点火器视图中有一个表单验证javascript代码，但它无法正常工作，仍然在没有任何验证的情况下将值发送到下一页。你能告诉我我在哪里弄错了，为什么这样正在发生什么？

代码：

<form method="get" action="/calculator/stage_two" name="calculate" id="calculate" onsubmit="return validateForm();">
    <div class="calc_instruction">
        <input type="text" name="property_number" placeholder="No/Name" id = "property_number" class="stage_one_box" />
        <input type="text"  name="postcode" placeholder="Postcode" id = "postcode" class="stage_one_box" />
    </div>
    <input type = "image" name = "submit_calculator" id = "submit_calculator" value="Go" src = "/images/next_button.png" />
</form>

Javascript功能：

<script type="text/javascript">
    function validateForm() {
        var postcode=document.forms["calculate"]["postcode"].value;
        if (postcode==null || postcode=="") {
            alert("Please enter the postcode to give you more accurate results");
            document.forms["calculate"]["postcode"].focus();
            return false;
        }
</script>

Answer 1

您缺少一个结束括号。验证代码中的任何错误都将返回非假值并允许提交

以下是使用表单访问的规范方法：

<form method="get" action="/calculator/stage_two" name="calculate" 
  id="calculate"  onsubmit="return validateForm(this);">
  <div class="calc_instruction">
    <input type="text" name="property_number" placeholder="No/Name" id = "property_number" class="stage_one_box" />
    <input type="text"  name="postcode" placeholder="Postcode" 
      id = "postcode" class="stage_one_box" />
  </div>

    <input type = "image" name = "submit_calculator" id="submit_calculator" src="/images/next_button.png" />
</form>


<script type="text/javascript">
function validateForm(theForm) {
  var postcode=theForm.postcode;

  if (postcode.value=="")  { // cannot be null or undefined if value="" on field
    alert("Please enter the postcode to give you more accurate results");
    postcode.focus();
    return false;
  }
  return true; // allow submit
}
</script>

Answer 2

似乎你错过了函数末尾的结束括号“} ”。

<script type="text/javascript">
function validateForm() {

    var postcode=document.forms["calculate"]["postcode"].value;
    if (postcode==null || postcode=="")
    {
        alert("Please enter the postcode to give you more accurate results");
        document.forms["calculate"]["postcode"].focus();
         return false;
    }
} // <-- here 
</script>

Answer 3

请添加功能

的大括号

<script type="text/javascript">
function validateForm()
 {
  var postcode=document.forms["calculate"]["postcode"].value;
  if (postcode==null || postcode=="")
  {
   alert("Please enter the postcode to give you more accurate results");
   document.forms["calculate"]["postcode"].focus();
    return false;
  }
 }
 </script>

Answer 4

在这里尝试插入调试器并尝试go throw方法

<script type="text/javascript">
 function validateForm() {
     debugger;
     var postcode=document.forms["calculate"]["postcode"].value;
     if (postcode==null || postcode=="")
     {
       alert("Please enter the postcode to give you more accurate results");
       document.forms["calculate"]["postcode"].focus();
       return false;
     }

Answer 5

你的javascript函数中的

缺少

请使用此

你的javascript右大括号中缺少

<script type="text/javascript">
 function validateForm()
 {

   var postcode=document.forms["calculate"]["postcode"].value;
   if (postcode==null || postcode=="")
    {
    alert("Please enter the postcode to give you more accurate results");
    document.forms["calculate"]["postcode"].focus();
     return false;
    }
}
   </script>

Answer 6

尝试这一行

var postcode=document.getElementById("postcode").value;

而不是

var postcode=document.forms["calculate"]["postcode"].value;

和

postcode==undefined

而不是

postcode==null

和function validateForm() {您错过了结束}

Answer 7

在您发布的代码中，您缺少validateForm（）函数的右大括号，因此假设这是您的实际代码，发生的事情是您在提交时遇到JavaScript错误，导致浏览器只发布表单

使用JavaScript和html进行表单验证

7 个答案: