檢查以確保所有字段都已填寫

Question

我正在嘗試在jquery中為我的輸入字段創建一個簡單的驗證器。 目前我得到以下內容：

function checkInputs(){
var isValid = true;
$('.input-required').each(function() {
     if($(this).val() === ''){
        isValid = false;
         return false;
     }        
 });
return isValid;
}

然后我得到了一個正確的按鈕，它是：

$('#confirm').click(function () { 
    alert(checkInputs());
});

但是，即使輸入為空，也始終返回true。 同樣，在完成所有輸入后，將啟用一個按鈕來單擊。

編輯了它，使其現在具有選擇器，但仍然始終為true。

提前致謝

Answer 1

嘗試使用filter屬性來獲取具有required屬性的輸入。

$('input').filter('[required]')

添加了代碼以檢查輸入是否已填充以及啟用或禁用button 。 請注意，如果使用此選項，則$('#confirm').click(function());不大$('#confirm').click(function()); 功能，因為僅當輸入被填充時，此按鈕才會啟用。

 function checkInputs() { var isValid = true; $('input').filter('[required]').each(function() { if ($(this).val() === '') { $('#confirm').prop('disabled', true) isValid = false; return false; } }); if(isValid) {$('#confirm').prop('disabled', false)} return isValid; } $('#confirm').click(function() { alert(checkInputs()); }); //Enable or disable button based on if inputs are filled or not $('input').filter('[required]').on('keyup',function() { checkInputs() }) checkInputs() 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form> <input required> <input required> <input required> <button id="confirm">check</button> </form> 

Answer 2

嘗試通過以下方式定位元素： $('input[required]')

這應該可以解決問題。

Answer 3

您的選擇器正在尋找顯然不存在的tagName <input-required></input-required> 。

為課程添加點前綴

也可以使用filter()來簡化

function checkInputs(){
    return !$('.input-required').filter(function() {
         return !this.value;   
     }).length;
}

注意：如果單選框或復選框是該類元素集合的一部分，則將無法使用，並且在這種情況下，您需要為類型添加條件

Answer 4

如果為0，則所有輸入已填充，否則將返回0，表示任何一個或多個為空輸入。

 function checkInputs(){
  var flag = 0;
  $('input').each(function() {
       if($(this).val() == ''){
         return flag = 1;
       }
   });
  return flag;
  }
  $('#confirm').click(function () {
      alert(checkInputs());
  });

Answer 5

您忘記將類符號放在jQuery中：

function checkInputs() {
    var isValid = true;
    $('.input-required').each(function() {
     if($(this).val() === ''){
        isValid = false;
         return false;
     }        
  });

  return isValid;
}

嘗試這個..