jQuery確保填寫所有表單字段

Question

我有一個簡單的表單，我正在進行客戶端驗證。 要進行驗證，不應將任何字段留空。 這是我的方式：

function validateForm() {
  $('.form-field').each(function() {
    if ( $(this).val() === '' ) {
      return false
    }
    else {
      return true;
    }
  });
}

出於某種原因，即使填寫了所有字段，我的函數也總是返回false。

Answer 1

您不能在匿名函數中返回false。 此外，如果它確實有效，如果第一個字段為空，則返回false，否則返回true，並完全忽略其余字段。 可能有一個更優雅的解決方案，但你可以做這樣的事情：

function validateForm() {
  var isValid = true;
  $('.form-field').each(function() {
    if ( $(this).val() === '' )
        isValid = false;
  });
  return isValid;
}

另一個建議：這需要您使用該formfield類來裝飾所有表單字段。 您可能有興趣使用不同的選擇器進行過濾，例如$('form.validated-form input[type="text"]')

編輯啊，我打了一拳，但我的解釋仍然有效，希望有幫助。

Answer 2

您從內部函數返回而不是從validate方法返回

嘗試

function validateForm() {
    var valid = true;
    $('.form-field').each(function () {
        if ($(this).val() === '') {
            valid = false;
            return false;
        }
    });
    return valid
}

Answer 3

function validateForm() {
    var invalid= 0;
    $('.form-field').each(function () {
        if ($(this).val() == '') {
            invalid++;
        }
    });

   if(invalid>0)
       return false;
   else
       return true;
}

Answer 4

這是一個類似的方法：

function validateForm() {
  var valid = true;
  $('.form-field').each(function() {
    valid &= !!$(this).val();
  });
  return valid;
}

!! 只需將輸入值轉換為bool