文章出處

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,可以借助一個外部變量來輔助實現我們想要的功能。


文章列表




Avast logo

Avast 防毒軟體已檢查此封電子郵件的病毒。
www.avast.com


arrow
arrow
    全站熱搜
    創作者介紹
    創作者 大師兄 的頭像
    大師兄

    IT工程師數位筆記本

    大師兄 發表在 痞客邦 留言(0) 人氣()