一次一個提醒

Question

我正在做一個表單，我有一堆函數在窗體中來驗證某些字段，但我遇到的問題是，當您提交每個驗證返回false一個警報將彈出所以它最終成爲了很多警報，我只是想知道如何改變我自己調用函數或函數的方式，以便一次只能彈出一個警報。

我的表格目前的工作原理類似於如果您提交表格並將名字和姓氏字段留空並且這兩個字段都是強制性的，則會彈出兩個警報，說明您沒有填寫姓氏並且您還沒有填寫最後一個名字（這可能會讓我煩惱的字段數量）。

我試圖找出一種方法，以便如果您提交表單並留下兩個字段空只有一個警報會彈出說你沒有填寫名字，然後當你填寫第一個名稱字段並且仍然將姓氏字段留空，那麼將會彈出一個提示，說您沒有填寫姓氏。

下面是驗證功能的主要塊i具有：

function validateText() 
{ 
var firstname=document.getElementById('txtfirstname'); 
var familyname=document.getElementById('txtfamilyname'); 
var streetaddress=document.getElementById('txtaddress'); 
var suburb=document.getElementById('txtsuburb'); 
var postcode=document.getElementById('txtpostcode'); 
var country=document.getElementById('txtcountry'); 
var telephone=document.getElementById('txttelephone'); 
var email=document.getElementById('txtemail'); 
var regodate=document.getElementById('txtregodate'); 
var regocost=document.getElementById('txtregocost'); 

if (firstname.value=="") 
{ 
    alert("First name must be filled out"); 
    return false; 
} 
if (familyname.value=="") 
{ 
    alert("Family name must be filled out"); 
    return false; 
} 

var institutioncompany=document.getElementById('txtinstcomp').value; 
if (institutioncompany == "") 
{ 
    alert("Institution/company must be filled out"); 
    return false; 
} 
var category=document.getElementById('category').value; 
if (category == "UWS Student" || category == "Other UWS Staff" || category == "UWS Academic") 
{ 
    if (document.getElementById("txtnumber").value == "") 
    { 
     alert('Student number/Staff number is mandatory'); 
     return; 
    } 
} 

if (streetaddress.value=="") 
{ 
    alert("Street address must be filled out"); 
    return false; 
} 
if (suburb.value=="") 
{ 
    alert("Suburb must be filled out"); 
    return false; 
} 
if (postcode.value=="") 
{ 
    alert("Postcode must be filled out"); 
    return false; 
} 
if (country.value=="") 
{ 
    alert("Country must be filled out"); 
    return false; 
} 
if (telephone.value=="") 
{ 
    alert("Telephone number must be filled out"); 
    return false; 
} 
if (email.value=="") 
{ 
    alert("Email address must be filled out"); 
    return false; 
} 
if (regodate.value=="") 
{ 
    alert("Date of registration must be filled out"); 
    return false; 
} 
if (regocost.value=="") 
{ 
    alert("Cost of registration must be filled out"); 
    return false; 
} 
} 


function validateCheckBoxes(theForm) 
{ 
if (
theForm.checkbox.checked == false && 
theForm.checkbox1.checked == false && 
theForm.checkbox2.checked == false) 
{ 
    alert ('You didn\'t choose any of the checkboxes'); 
    return false; 
} else {  
    return true; 
} 
} 

function validateRadioButton() 
{ 
var radios = document.getElementsByName('yesno'); 

for (var i = 0; i < radios.length; i++) 
{ 
    if (radios[i].checked) 
{ 
    return true; //checked 
} 
}; 
// not checked, show error 
alert ('You didn\'t choose whether you wanted a copy of work proceedings'); 
return false; 
} 


function validateEmail() 
{ 
var emailID = document.rego.email.value; 
atpos = emailID.indexOf("@"); 
dotpos = emailID.lastIndexOf("."); 
if (atpos < 1 || (dotpos - atpos < 2)) 
{ 
    alert("Please enter correct email ID"); 
    return false; 
} 
return(true); 
} 

這裏爲i調用一些功能的方式：

<form name="rego" action="submit.htm" onsubmit="return !!(validateText() & validateCheckBoxes(this) & validateRadioButton() & validateEmail() & populateInstitution());" method="POST"> 

Answer 1

&裝置按位與在JavaScript & &是邏輯AND so

!!(validateText() 
    & validateCheckBoxes(this) 
    & validateRadioButton() 
    & validateEmail() 
    & populateInstitution()) 

將導致每個函數的評估以及所有結果的按位和操作。

當你做這樣的：

!!(validateText() 
    && validateCheckBoxes(this) 
    && validateRadioButton() 
    && validateEmail() 
    && populateInstitution()) 

的第一個函數返回false將結束評價，因爲虛假的，（邏輯）任何東西都不會最終成爲假......這是一段JavaScript的內部優化因此第一個返回false之後的函數將不會被評估換句話說......

Answer 2

因此，在我可以發佈我的評論作爲答案之前，我被打斷了。

這是我會考慮如果我不想要jQuery驗證。

關鍵問題是努力保持一致。您需要返回true，到處假

形式：

<form onsubmit="return validate(this)"...> 

的JavaScript：

function validate(theForm) { 
    return validateText() && 
     validateCategory(document.getElementById("txtcategory")) && 
     validateCheckBoxes(theForm) && 
     validateEmail(theForm); 

} 

function validateCategory(category) { 
    var val = category.value; 
    if (document.getElementById("txtnumber").value == "" && (val == "UWS Student" || val == "Other UWS Staff" || val == "UWS Academic")) { 
    alert('Student number/Staff number is mandatory'); 
    document.getElementById("txtnumber").focus(); 
    return false; 
    } 
    return true; 
} 

var mandatory = { 
firstname: "First name must be filled out", 
familyname: "Family name must be filled out", 
instcomp : "Institution/company must be filled out", 
streetaddress: "Street address must be filled out", 
suburb: "Suburb must be filled out", 
postcode: "Postcode must be filled out", 
country:"Country must be filled out", 
telephone: "Telephone number must be filled out", 
email:"Email address must be filled out", 
regodate:"Date of registration must be filled out", 
regocost:"Cost of registration must be filled out" 
}; // note no comma after the last 

function validateText() { 
    for (var o in mandatory) { 
    var fld = document.getElementById("txt"+o); 
    if (fld.value==="") { 
     alert(mandatory[o]); 
     fld.focus(); 
     return false; 
    } 
    } 
    return true; 
} 
function validateCheckBoxes(theForm) { 
    if (theForm.checkbox.checked && theForm.checkbox1.checked && theForm.checkbox2.checked) return true; 
    alert ('You didn\'t choose any of the checkboxes'); 
    return false; 
} 

function validateRadioButton() { 
var radios = document.getElementsByName('yesno'); 
for (var i = 0; i < radios.length; i++) { 
    if (radios[i].checked) { 
    return true; //checked 
    } 
} 
// not checked, show error 
    alert ('You didn\'t choose whether you wanted a copy of work proceedings'); 
    return false; 
} 
function validateEmail(theForm) { 
    var email = theForm.email; 
    var emailID = email.value; 
    atpos = emailID.indexOf("@"); 
    dotpos = emailID.lastIndexOf("."); 
    if (atpos < 1 || (dotpos - atpos < 2)) { 
    alert("Please enter correct email ID"); 
    email.focus(); 
    return false; 
    } 
    return true; 
}