jquery 的 each 方法中 return 的坑

Chapter 0

在項目中使用 jquery 的 each 方法時想在 each 的迴圈中返回一個布爾類型的值於是掉進一個坑中...

Chapter 1

最初的代碼：

    這裡的代碼，雖然return 了，但是並未實際 return 值作為方法的返回值，而且還是繼續往後執行。 在網上查詢之後發現在 jquery 的 each 方法中如果 return true 相當於是 continue，而 return false 相當於是 break。 

 1 $(":checkbox[name='insurace-category']:checked").each(function (index, ele) {
 2         var _item = $(".gift_option_item_" + $(ele).val());
 3         if (_item && _item.length > 0) {
 4             var _premium = $.trim($(_item).find(".custom_inputbox").eq(0).val());
 5             var _selectElement = $(_item).find("select");
 6             if (_selectElement && _selectElement.length > 0) {
 7                 var _amount = $.trim($(_selectElement).val());
 8                 if (!_amount) {
 9                     layer.msg("請選擇保額！", function () {
10                         $(_selectElement).focus();
11                     });
12                     return false;
13                 }
14             }
15             if (!_premium) {
16                 layer.msg("請輸入保費！", function() {
17                     $(_item).find(".custom_inputbox").eq(0).focus();
18                 });
19                 return false;
20             }
21         }
22     });

Chapter 2

我的解決方案如下：

修改後的代碼：

 1    var _isInvalid = false;
 2     $(":checkbox[name='insurace-category']:checked").each(function (index, ele) {
 3         var _item = $(".gift_option_item_" + $(ele).val());
 4         if (_item && _item.length > 0) {
 5             var _premium = $.trim($(_item).find(".custom_inputbox").eq(0).val());
 6             var _selectElement = $(_item).find("select");
 7             if (_selectElement && _selectElement.length > 0) {
 8                 var _amount = $.trim($(_selectElement).val());
 9                 if (!_amount) {
10                     layer.msg("請選擇保額！");
11                     $(_selectElement).focus();
12                     _isInvalid = true;
13                     return false;
14                 }
15             }
16             if (!_premium) {
17                 layer.msg("請輸入保費！");
18                 $(_item).find(".custom_inputbox").eq(0).focus();
19                 _isInvalid = true;
20                 return false;
21             }
22         }
23     });
24     if (_isInvalid) {
25         return false;
26     }

 
我這裡藉助了一個變數來輔助判斷，當不滿足條件時設置為 true ,在迴圈外判斷這個變數的值，如果變數的值是 true 則證明又不合法的值，如果變數的值為 false，則證明所需要判斷的值都符合要求

Summary

　　jquery each 方法中的 return 實際上是不會 return 啊，在 jquery each 方法中 return false，可以藉助一個外部變數來輔助實現我們想要的功能。