jQuery数组/对象异常迭代

时间:2014-06-07 07:44:41

标签: javascript php jquery

我有4个std类对象,我从db通过json传递给javascript,如下所示:

var options_de = <?php echo $data[0]->options_de; ?>;
var options_cz = <?php echo $data[0]->options_cz; ?>;
var options_en = <?php echo $data[0]->options_en; ?>;
var options_pl = <?php echo $data[0]->options_pl; ?>;

编辑: 这是解决方案:

for(var x=1; x<=Object.keys(options_de).length; x++) {
    $('.d_options').append('<input type="text" class="i_options_de" autocomplete="off" value="'+options_de[x]+'" />');
    $('.d_options').append('<input type="text" class="i_options_cz" autocomplete="off" value="'+options_cz[x]+'" />');
    $('.d_options').append('<input type="text" class="i_options_en" autocomplete="off" value="'+options_en[x]+'" />');
    $('.d_options').append('<input type="text" class="i_options_pl" autocomplete="off" value="'+options_pl[x]+'" /><a class="remove">X</a>');
}

所有工作正常但不幸的是我在下一个循环开始之前从开始到结束获得每个循环并且我不能这样做。我需要这样:

  • 1 de 1 cz 1 en 1 pl
  • 2 de 2 cz 2 en 2 pl
  • 依旧等等

任何人都知道如何修改它以我需要的方式工作? ;)

3 个答案:

答案 0 :(得分:2)

Javascript对象与数组不同,并且没有length属性。相反,做这样的事情来处理不同的对象长度:

https://stackoverflow.com/a/6700/3715815

答案 1 :(得分:0)

如果所有对象的长度相同,只需在一个循环中包含所有对象,这将在第一次迭代中输出所有第一个成员,在下一个迭代中输出所有第二个成员,等等。

答案 2 :(得分:0)

您可以简单地遍历数组并每次检查索引是否有意义

香草JS

var options_de = ['1 de', '2 de', '3 de'];
var options_cz = ['1 cz', '2 cz', '3 cz'];
var options_en = ['1 en', '2 en'];
var options_pl = ['1 pl', '2 pl', '3 pl'];

var decorate = function(element){
    return '<input type="text" class="i_options_de" autocomplete="off"   value="'+element+'">';
}

var max_length = Math.max(options_de.length,
                          options_cz.length,
                          options_en.length,
                          options_pl.length);

var html = [];
html.push('<ul>');
for(var i = 0; i < max_length; i++){
    html.push('<li>');
    options_de.length > i ? html.push(decorate(options_de[i])) : null;
    options_cz.length > i ? html.push(decorate(options_cz[i])) : null;
    options_en.length > i ? html.push(decorate(options_en[i])) : null;
    options_pl.length > i ? html.push(decorate(options_pl[i])) : null;
    html.push('</li>');
}
html.push('</ul>');

html = html.join('');

document.getElementsByTagName('body')[0].innerHTML = html;

JSFidle: http://jsfiddle.net/kVd4K/