Question

我的EnquiryForm上有一些必填字段。我确实有一个警告框提示用户错误。但我已经将其删除并输入了文本字段中的错误。

现在我不确定在满足所有条件后如何编码返回false。

验证工作正常，表单不提交。

我是javascripting提前预测的新手......

这是我的代码：

// Enquiry Form Validation
function enquiryFormValidation() {

// Setting Variables

var errormessage = "";

var ufirstname = document.getElementById("firstname");
var usurname = document.getElementById("surname"); 
var uaddress = document.getElementById("address");
var upostcode = document.getElementById("postcode");
var uemail = document.getElementById("email");
var uhearabout = document.getElementById("where");
var fday = document.getElementById("fday");
var fmonth = document.getElementById("month");
var fyear = document.getElementById("year");
var ftype = document.getElementById("ftype");
var garrival = document.getElementById("garrival");
var fend = document.getElementById("fend");


if (ufirstname.value == "(e.g. John)") {
ufirstname.style.border = "1px solid red" ;
ufirstname.style.color = "red" ;
ufirstname.value = "Firstname Required"
 }

if (usurname.value == "(e.g. Smith)") {
usurname.style.border = "1px solid red" ;
usurname.style.color = "red" ;
usurname.value = "Surname Required"
 }

if (uaddress.value == "(e.g. 101 Party Street, Wellington)") {
uaddress.style.border = "1px solid red" ;
uaddress.style.color = "red" ;
uaddress.value = "Address Required"
 }

if (upostcode.value == "(e.g. TF1 7HU)") {
upostcode.style.border = "1px solid red" ;
upostcode.style.color = "red" ;
upostcode.value = "Postcode Required"
 }   

if (uemail.value == "(e.g. lets_party@glimmer-nights.co.uk)") {
uemail.style.border = "1px solid red" ;
uemail.style.color = "red" ;
uemail.value = "Email Address Required"
 }   

if (uhearabout.options[uhearabout.selectedIndex].value == "blank") {
uhearabout.style.border = "1px solid red" ;
uhearabout.style.color = "red" ;
 }

if (fday.options[fday.selectedIndex].value == "blank") {
fday.style.border = "1px solid red" ;
fday.style.color = "red" ;
 }

if (fmonth.options[fmonth.selectedIndex].value == "blank") {
fmonth.style.border = "1px solid red" ;
fmonth.style.color = "red" ;
 }

if (fyear.options[fyear.selectedIndex].value == "blank") {
fyear.style.border = "1px solid red" ;
fyear.style.color = "red" ;
 }

if (ftype.options[ftype.selectedIndex].value == "blank") {
ftype.style.border = "1px solid red" ;
ftype.style.color = "red" ;
 }

if (garrival.options[garrival.selectedIndex].value == "hh:mm") {
garrival.style.border = "1px solid red" ;
garrival.style.color = "red" ;
 }

if (fend.options[fend.selectedIndex].value == "hh:mm") {
fend.style.border = "1px solid red" ;
fend.style.color = "red" ;
 }

 {
return false;    
 }

} // End of enquiryForm-validation function

Answer 1

你需要重构这个。

例如

var valFields = { 
  "firstname":"Please enter a first name",
  "surname":"Please enter a surname",
  .
  .
   "fend":"please enter a valid time in HH:mm format"
}// note no comma after the last

function validate() {
  for (var fieldID in valFields) {
    var field = document.getElementById(fieldID);
    field.className ="normal"; // for example
    if (
      (field.type=="text" && field.value==field.defaultValue) ||
      (field.type=="select" && field.selectedIndex<1) // and so on
    ) {
      field.className="red" // for example
      alert(valFields[fieldID]);
      return false;// cancel submit
    }
  }
  return true;// allow submit
}

使用

<form onsubmit="return validate()">

哪个应该设置在头部而不是内联，但我在iPad上并且厌倦了输入

查询表格未提交

1 个答案: