javascript - 程序中缺少什么?即使字段留空,表单也会被接受

标签 javascript html forms validation

    <form name="form" method="post" action="thanks.html" onsubmit="final()">
            <div id="errorBox"> </div>
            <div class="marginn">                               
                                                <input type="name" name="name" value="" placeholder="name" size="40" /></br>
                                                <input type="email" name="email" placeholder="email" size="40" value="" /></br>



            <div><b>Birthday</b>
            <select name="birthday_month" >
              <option value="" selected >Month</option>
              <option value="1">Jan</option>
              <option value="2">Feb</option>
              <option value="3">Mar</option>
              <option value="12">Dec</option>
            </select>
              <select name="birthday_day" >
              <option value="" selected>Day</option>
              <option value="1">1</option>
        </select>
            &nbsp;&nbsp;
            <select name="birthday_year">
              <option value="" selected>Year</option>
              <option value="2009">2009</option>
            </select>
        </div>
    <input type="submit" name="submit" value="submit"/>
    </form>


\\the javascript code for validation is 

上面的 html 表单使用下面给出的 JavaScript 代码进行验证。即使字段填写不正确或留空,也会提交表单。 请告诉我我错过了什么。 提前致谢。 :)

function final(){
 var emailRegex = /^[A-Za-z0-9._]*\@[A-Za-z]*\.[A-Za-z]{2,5}$/;
 var name = document.form.name.value;
 var femail = document.form.email.value;
 var fmonth = document.form.birthday_month.value;
   var fday = document.form.birthday_day.value;
   var fyear = document.form.birthday_year.value;


 if( name == null || name== "")
   {
     document.form.name.focus() ;
     //document.getElementById("errorBox").innerHTML = "enter the first name";
     alert("Name Empty");
     return false;
   }
   if (femail == null || femail== "" )
 {
  document.form.email.focus();
  document.getElementById("errorBox").innerHTML = "enter the email";
  alert("please enter Email");
  return false;
  }
  else if(!emailRegex.test(femail)){
  document.form.email.focus();
  document.getElementById("errorBox").innerHTML = "enter the valid email";
  return false;
  }
   if (fmonth == null|| fmonth=="") {
        document.form.birthday_month.focus();
  document.getElementById("errorBox").innerHTML = "select the birthday month";
        return false;
     }
  if (fday == ""|| fday== null) {
        document.form.birthday_day.focus();
  document.getElementById("errorBox").innerHTML = "select the birthday day";
        return false;
     }
  if (fyear == ""||fyear==null) {
        document.form.birthday_year.focus();
  document.getElementById("errorBox").innerHTML = "select the birthday year";
        return false;
     }
  if(document.form.radiobutton[0].checked == false && document.form.radiobutton[1].checked == false){
    document.getElementById("errorBox").innerHTML = "select your gender";
    return false;
   }

  if(name != '' && femail != ''){
      alert("done");
   document.getElementById("errorBox").innerHTML = "form submitted successfully";
  return true;
   }

}

最佳答案

onsubmit="final()"

需要

onsubmit="return final()"
//        ^^^^^^

onXyz 属性样式处理程序的内容视为函数的主体(一旦浏览器为您完成设置,这正是它最终的样子)。所以就像

function submitHandler() {
    final();
}

...不会从 submitHandler 返回任何内容,因此 false 永远不会进入浏览器的事件代码 onsubmit="final() “ 也不从处理程序返回任何内容。

关于javascript - 程序中缺少什么?即使字段留空,表单也会被接受,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32221688/

相关文章:

javascript - node.js页面刷新两次调用资源?

javascript - 如何在jsp中的警报/消息框中显示图像

javascript - 具有 infoWindowContent 和用户地理位置的多个制作者

javascript - 代码在 jsfiddle 中有效,但在 Lamp Localhost 中无效

javascript - 无法将对象插入到 json 对象数组中

javascript - 在事件更改时跨表保持状态

java - 通过上传文件更新网页表

html - 如何在图像上添加多个复选框

forms - 如何在 Twig 模板中隐藏表单字段?

Python Mechanize 错误 +