爲什麼這個jQuery輸入值檢查器不起作用？

Question

我需要檢查所有的輸入，看看他們是否充滿，在這種情況下，提交按鈕將成爲可按壓，用戶可以放心地提交數據：

unfilled = false; 
$('.add-field').keypress(function(){ 
    $('.add-field').each(function(){ 
     if($(this).val() === ''){ 
      unfilled = true; 
     } else { 
      unfilled = false; 
     } 
    }) 
    console.log(unfilled); 
}); 

此代碼的工作，但它有一個奇怪的捻;當最後一個空輸入獲得一個字符時，它仍然返回true。如果輸入獲得另一個字符，則只有它返回false。我對此感到困惑，因爲我知道.each()函數在一個字符被添加並且輸入的值已被更新後被觸發。因此，我不明白爲什麼它沒有註冊那個價值。

Answer 1

您可以使用過濾器和使用keyup事件，而不是爲Del鍵：

DEMO

$('.add-field').keyup(function() { 
    var unfilled = !! $('.add-field').filter(function() { 
     return $.trim(this.value) === "" 
    }).length; 
    console.log(unfilled); 
}); 

Answer 2

這裏===意味着它是精確匹配的數據類型：

if($(this).val() === ''){ 

與==替換爲：

if($(this).val() == ''){ 

Answer 3

據我所知，這是一個「問題」使用時KeyPress -event，因爲瀏覽器的UI線程沒有更新輸入字段的值。因此當前值仍然是'空'，因此返回true;您可以使用KEYUP -event或嘗試這樣的事：JavaScript keypress event get end value of textarea

Answer 4

您應該設置unfilled到false進入循環前（但內裏的keyup）。

在循環中，您應該只設置unfilled到true當字段emty而不是重新設置爲false，否則如果最後一個字段填入你只知道。