Question

我希望通过jQuery.each和数据hotel_id从数组中追加一些，每个hotel_id的数字是4，并且此循环$.each(data[0].hotel_id,... });在self内运行4次内容，以防万一数据库行residence_u和residence_p中有或插入3次（每次有3个，而不是4个（如hotel_id）），运行以下代码时，此代码不有错误jus无法正常工作。如果我删除代码$.each(info_ru.units,... });和$.each(info_rp.start_date,... });，则可以使用

（有四个data[0].hotel_id项，但只有三个data[0].residence_u项。因此，当外循环到达index === 3时，没有data[0].residence_u[index]）

查看完整的我的js代码：http://jsfiddle.net/6sGBd/

这是我在ajax调用中的js代码（url: 'get_gr',）的摘要：

$.each(data[0].hotel_id, function (index, value) {
    var $li = $('<li><input name="hotel_id[]" value="' + value.hotel_id + '" style="display:none;"></li>');
    var $tooltip = $('<div class="tooltip"></div>').appendTo($li);
    $li.appendTo('#residence_name');

    var info_ru = data[0].residence_u[index];
    $.each(info_ru.units, function (index, value) {
        $tooltip.append(value + ' & ' + info_ru.extra[index] + ' & ' + info_ru.price[index] + '<br>');
    });

    var info_rp = data[0].residence_p[index];
    $.each(info_rp.start_date, function (index, value) {
        $tooltip.append(value + ' & ' + info_rp.end_date[index] + ' & ' + info_rp.price_change[index] + '<br>');
    });
    tool_tip()
});

这是输出php代码（url: 'get_gr',）：

[{
    "guide": null,
    "hotel_id": [{
        "hotel_id": ["1"]
    }, {
        "hotel_id": ["2"]
    }, {
        "hotel_id": ["3"]
    }, {
        "hotel_id": ["4"]
    }],
    "residence_u": [{
        "units": ["hello", "how", "what"],
        "extra": ["11", "22", "33"],
        "price": ["1,111,111", "2,222,222", "3,333,333"]
    }, {
        "units": ["fine"],
        "extra": ["44"],
        "price": ["4,444,444"]
    }, {
        "units": ["thanks", "good"],
        "extra": ["55", "66"],
        "price": ["5,555,555", "6,666,666"]
    }],
    "residence_p": [{
        "start_date": ["1111", "2222"],
        "end_date": ["1111", "2222"],
        "price_change": ["1111", "2222"]
    }, {
        "start_date": ["3333", "444"],
        "end_date": ["3333", "4444"],
        "price_change": ["3333", "4444"]
    }, {
        "start_date": ["5555", "6666"],
        "end_date": ["5555", "6666"],
        "price_change": ["5555", "6666"]
    }]
}]

输出js代码是这样的：

1
hello＆amp; 11＆amp; 1,111,111
how＆amp; 22＆amp; 2,222,222
what＆amp; 33 ＆安培; 3,333,333,
1111＆amp; 1111＆amp; 1111
2222＆amp; 2222＆amp; 2222

2
fine＆amp; 44＆amp; 4,444,444
3333＆amp; 3333＆amp; 3333
4444＆amp; 4444＆amp; 4444

3
thanks＆amp; 55＆amp; 5,555,555
good＆amp; 66＆amp; 6,666,666
5555＆amp; 5555＆amp; 5555
6666＆amp; 6666＆amp; 6666

4

如何修复它以及我该怎么做？

Answer 1

你可以使用'return'来摆脱循环。

所以你可以添加

if(index === 3){
    return false;
}

就在你的第一个$ .each

的顶部

Answer 2

residence_u数组的长度仅为3，因此当index == 4并指定var info_ru = data[0].residence_u[index];然后访问未定义的info_ru的元素时出现错误并停止执行。

您可以通过检查info_ru和info_rp是包含您要查找的元素的对象来修复它。

$.each(data[0].hotel_id, function (index, value) {
    var $li = $('<li><input name="hotel_id[]" value="' + value.hotel_id + '" style="display:none;"></li>');
    var $tooltip = $('<div class="tooltip"></div>').appendTo($li);
    $li.appendTo('#residence_name');

    var info_ru = data[0].residence_u[index];
    if (info_ru && typeof info_ru === 'object' && info_ru.hasOwnProperty('units')) {
        $.each(info_ru.units, function (index, value) {
          $tooltip.append(value + ' & ' + info_ru.extra[index] + ' & ' + info_ru.price[index] + '<br>');
        });
    }

    var info_rp = data[0].residence_p[index];
    if (info_rp && typeof info_rp === 'object' && info_rp.hasOwnProperty('start_date')) {
        $.each(info_rp.start_date, function (index, value) {
            $tooltip.append(value + ' & ' + info_rp.end_date[index] + ' & ' + info_rp.price_change[index] + '<br>');
        });
    }
    tool_tip()
});

Answer 3

我会建议几件事：

如果你使用相同的数据格式，那么你应该采取防御性编码来防范三个并行数组中不同的数组长度。您可以编写代码来仅迭代三个数组中最短的数组，这样您的索引就不会超出范围。
您可以修复数据结构，以便在给定迭代中聚合的所有数据都在一个对象中，因此您永远不会有不同数量的不同属性。您使用hotel_id，单位，价格等制作一个对象......而不是为每个对象创建单独的数组。保留对象的所有属性，而不是您必须与对象关联的属性数组。

至于您当前的代码，您的代码逻辑只是有缺陷的。你有一个外部.each()循环遍历有4个项目的hotel_id数组，但是你使用该循环中的索引到达另外两个没有相同项目数的数据结构。您的数据错误或您的代码逻辑存在缺陷，在这两种情况下，您的代码都不会被防御性地写入以防止不匹配的数组长度。

要知道当你在hotel_id，residence_u和residence_p数组中有不同数量的项目时你真正想要推荐什么，我们必须更多地了解你真正想要做的事情。< / p>

您可以通过更改外部循环来进行防御性编码，以便只对其他数组进行迭代。所以，如果最短的数组是3长，那么你在外循环中迭代最多，所以你的索引永远不会超出界限：

var minLen = Math.min(Math.min(data[0].hotel_id.length, data[0].residence_u.length), data[0].residence_u.length);
for (var index = 0; index < minLen; index++) {
    var value = data[0].hotel_id[index];
    var $li = $('<li><input name="hotel_id[]" value="' + value.hotel_id + '" style="display:none;"></li>');
    var $tooltip = $('<div class="tooltip"></div>').appendTo($li);
    $li.appendTo('#residence_name');

    var info_ru = data[0].residence_u[index];
    $.each(info_ru.units, function (index, value) {
        $tooltip.append(value + ' & ' + info_ru.extra[index] + ' & ' + info_ru.price[index] + '<br>');
    });

    var info_rp = data[0].residence_p[index];
    $.each(info_rp.start_date, function (index, value) {
        $tooltip.append(value + ' & ' + info_rp.end_date[index] + ' & ' + info_rp.price_change[index] + '<br>');
    });
    tool_tip()
});

$ .each和jQuery中的问题

3 个答案: