表單驗證 - 如何使用if和else if

我試圖做一個Javascript表單驗證，我想設置的formValue爲0幾種情況。也就是說，如果任何所需的字段不填寫，該值應該爲0表單驗證 - 如何使用if和else if

function formValidation() { 
      var formValue = 1; 

      if (document.getElementById('orgname').value == '') formValue = 0; 
      else if (document.getElementById('culture[]').value == '') formValue = 0; 
      else if (document.getElementById('category[]').value == '') formValue = 0; 
      else if (document.getElementById('service[]').value == '') formValue = 0; 

      if (formOkay == 1) { 
      return true; 
     } else if (formOkay == 0) { 
      alert('Please fill out all required fields'); 
      return false; 
     } 
}

有沒有更優雅的方式來做到這一點？

編輯：腳本似乎沒有奏效，現在。

來源

2011-12-05 Andrew Alexander

你可以做一些循環：

var toCheck = ['orgname', 'culture[]', 'category[]', 'category[]'] 
for(var id in toCheck) 
{ 
    if(document.getElementById(id).value == ''){ 
     formValue = 0; 
     break; 
    } 
}

更優雅的方式可以是您指定您要檢查每個輸入一個「必要」級，比執行以下操作使用jQuery：

$(document).ready(function(){ 
    var toCheck = $('.required'); 
    var formValue = 1; 
    $.each(toCheck, function(index, element){ 
     if(element.val() == '') 
      formValue = 0; 
    }); 
});

來源

2011-12-05 13:41:52

或使用HTML5'required'屬性:) – thwd

@湯姆：這是正確的，當然，但它不是在所有的瀏覽器都支持呢。 –

像這樣的東西應該幫助（假定value屬性可對所引用的元素）：

var ids = ["orgname", "culture[]", "category[]", "service[]"], 
    formValue = 1; // default to validation passing 

for (var i = 0, len = ids.length; i < len; i++) { 
    if (document.getElementById(ids[i]).value === "") { 
     formValue = 0; 
     break; // At least one value is not specified so we don't need to continue loop 
    } 
}

來源

2011-12-05 13:49:54 jabclab

我在其他語言中使用布爾邏輯做到了這一點，採取&運營商的優勢。如果有任何值爲false，則始終返回false。

喜歡的東西：

function formValidation() { 
    var formValue = true; 

    formValue &= document.getElementById('orgname').value != ''; 
    formValue &= document.getElementById('culture[]').value != ''; 
    formValue &= document.getElementById('category[]').value != ''; 
    formValue &= document.getElementById('service[]').value != ''; 

    if(!formValue) { 
    alert('Please fill out all required fields'); 
    } 

    return formValue; 
}

這對其他方案的工作在您的邏輯是更復雜的優勢。任何最終評估結果爲true/false的內容都將適用於此解決方案。

然後我會減少邏輯重複的工作：

$(function() { 
    $('form').submit(function() { 
    var toValidate = $(this).find('input[data-validation]'); 
    for(var i=0; i<toValidate.length; i++) { 
     var field = $(toValidate[i]); 
     if(field.val().search(new RegExp(field.data('validation'))) < 0) { 
     alert("Please fill out all required fields!"); 
     return false; 
     } 
    } 
    }); 
});

：在使用jQuery @ Baszz的第二個答案

function formValidation() { 
    var formValue = true; 

    var elementIdsToCheck = ['orgname', 'culture[]', 'category[]', 'category[]']; 
    for(var elementId in elementIdsToCheck) { 
    formValue &= document.getElementById(elementId).value != ''; 
    } 

    if(!formValue) { 
    alert('Please fill out all required fields'); 
    } 

    return formValue; 
}

來源

2011-12-05 13:53:04

爲布爾邏輯豎起大拇指 – thwd

「實體名稱必須緊跟在實體引用之後」 - 這是什麼意思？ - 我的IDE，netbeans寫了這個。 –

@AndrewAlexander：嗯，也許JS不支持'＆='操作符，但只支持'＆'操作符。我會編輯我的答案來解決這個問題。 –

大廈，你也可以使用HTML5 data-屬性建立一個更通用的解決方案然後，您可以在標記中指定正則表達式：

<form> 
    <input type="text" data-validation=".+" /> 
</form>

對於必填字段，您可以使用「。+」作爲正則表達式，這意味着用戶必須至少輸入一個字符，但您當然可以使用正則表達式的全部潛力來檢查有效的電子郵件地址，電話號碼或郵政編碼代碼等等

來源

2011-12-05 14:07:42 amiuhle

您可以添加正則表達式到HTML標記？！這是驚人的！我不知道！ –

@ andrew-alexander您可以將任何字符串添加到HTML5'data-'屬性中，這當然可以包含正則表達式。在Chrome 15.x中進行快速測試後，更正了代碼片段 – amiuhle

表單驗證 - 如何使用if和else if

回答

相關問題