jquery每個防止循環的警報

Question

首先看看這段代碼。示例我有5個需要class的輸入字段。

var errMsg = "This is required!" 

$(function() { 
    $(".required").each(function() { 
     if($(this).val() == "" || $(this).val == errMsg) { 
     $(this).val(errMsg); 
     } 
     else { 
     alert("This should alert once"); 
     } 
    }); 
} 

我知道如果字段有值，它會提醒5次。我怎樣才能防止它？我如何提醒一次？我已經使用

event.stopImmediatePropagation 
event.preventDefault 

Answer 1

這並不完全清楚你想要做什麼。有兩個選項：

1. 停止each環：

   您可以通過返回false停止each循環：

   var errMsg = "This is required!" 
   
   $(function() { 
       $(".required").each(function() { 
        if($(this).val() == "" || $(this).val == errMsg) { 
        $(this).val(errMsg); 
        } 
        else { 
        alert("This should alert once"); 
        return false; // <=== Stop `each` 
        } 
       }); 
   } 
   

   詳見the documentation。

2. 設置一個標誌：

   如果您希望循環繼續，但對於alert只發生一次，使用標誌：

   var errMsg = "This is required!" 
   
   $(function() { 
       var alerted = false; 
       $(".required").each(function() { 
        if($(this).val() == "" || $(this).val == errMsg) { 
        $(this).val(errMsg); 
        } 
        else { 
        if (!alerted) { 
         alerted = true; 
         alert("This should alert once"); 
        } 
        } 
       }); 
   } 
   

   如果這樣做（讓循環繼續）見Guffa's answer。他將警報移至each之外，這爲您呈現信息的方式提供了更大的靈活性，並且更加清潔。

---

題外話：每次你打電話$()，它使3-4個函數調用和分配內存。如果您發現自己在一個函數中重複使用相同的$()，請考慮使用一次並重新使用它。因此，而不是：

if($(this).val() == "" || $(this).val == errMsg) { 
    $(this).val(errMsg); 
} 

做到這一點

var $this = $(this); 
if($this.val() == "" || $this.val == errMsg) { 
    $this.val(errMsg); 
} 

大部分資金將沒有多大關係，你不會做的事情上千次以上的時間，但它是一個好習慣成。顯然，不緩存的結果，如果你正在做一個DOM查詢和DOM可以一個電話，下一之間發生了變化......

Answer 2

$(function() { 
    $(".required").each(function() { 
     if($(this).val() == "" || $(this).val == errMsg) { 
     $(this).val(errMsg); 
     } 
     else { 
     alert("This should alert once"); 
     return false; // break the loop; 
     } 
    }); 
} 

Answer 3

使用的標誌。
這樣，你不會提醒消息後破環，但提醒只有一次：

var errMsg = "This is required!" 

$(function() { 
    var ok = true; 
    $(".required").each(function() { 
     if($(this).val() == "" || $(this).val == errMsg) { 
      $(this).val(errMsg); 
     } 
     else { 
      if(ok){ 
       alert("This should alert once"); 
       ok = false; 
      } 
     } 
    }); 
} 

Answer 4

你應該把警報外循環，然後你需要一個varaible跟蹤是否有任何空字段：

var errMsg = "This is required!" 

$(function() { 
    var showMsg = false; 
    $(".required").each(function() { 
     if($(this).val() == "" || $(this).val == errMsg) { 
     $(this).val(errMsg); 
     } else { 
     showMsg = true; 
     } 
    }); 
    if (showMsg) alert("This should alert once"); 
}