0

我从一些 JSON 中提取一些信息，效果很好。它最终使用以下内容生成一系列 div：

var i = 0;
$.getJSON(url, function(json) {
  $.each(json.projects, function(index, data) {
    //some stuff to find and filter my data
    $('<div/>', {
      id: i,
      "class" : "span4",
      html: '<h3>' + title + '</h3>' + description
    }).appendTo('#projectList');
  i = i + 1;
  });
});

我需要为#projectList 中的每 3 个 div 插入一个新的流体行。我认为 .slice() 将是我最好的选择（如果我弄错了，请随时纠正我）。所以我调用生成我的一系列 div，然后我尝试切片（从Wrap 每 3 个 div 中的 div 中获取和修改）。

var divs = $('#projectList > div');
for (var i = 0; i < divs.length; i+=3) {
  divs.slice(i, i+3).wrapAll('<div class="row-fluid"></div>');
}

当我查看我的结果时，我没有看到插入的行。Firebug 没有看到任何语法错误，并且 divs.length 的警报返回为 0。

4

2 回答 2

0

我相信你的原始代码也在工作

带有原始代码修改的演示 可能在您调用的原始代码中

var divs = $('#projectList > div');
for (var i = 0; i < divs.length; i+=3) {
  divs.slice(i, i+3).wrapAll('<div class="row-fluid"></div>');
}

在 AJAX 完成之前。

使用您当前的代码，如下所示，您在 ajax 完成后调用它......所以它可以工作......

$.getJSON(url, function(json) {
  $.each(json.projects, function(index, data) {
    if (index % 3 == 0) {
      currentIndex = index;
      $('#projectList').append('<div id="' + index + '" class="row-fluid">');
    }
    $('<div/>', {
      id: index,
      "class" : "span4",
      html: '<h3>' + title + '</h3>' + description
    }).appendTo('#' + currentIndex);
  });
});

试试下面的代码，告诉我它是否不起作用

var i = 0;
$.getJSON(url, function(json) {
  $.each(json.projects, function(index, data) {
    //some stuff to find and filter my data
    $('<div/>', {
      id: i,
      "class" : "span4",
      html: '<h3>' + title + '</h3>' + description
    }).appendTo('#projectList');
  i = i + 1;
  });

  var divs = $('#projectList > div');
   for (var i = 0; i < divs.length; i+=3) {
     divs.slice(i, i+3).wrapAll('<div class="row-fluid"></div>');
    }

});
于 2013-05-13T19:48:57.557 回答
0

根据评论中的建议之一，我重新编写了 $.getJSON 以插入行并避免使用 slice()。以下似乎运作良好。

var currentIndex;
$.getJSON(url, function(json) {
  $.each(json.projects, function(index, data) {
    if (index % 3 == 0) {
      currentIndex = index;
      $('#projectList').append('<div id="' + index + '" class="row-fluid">');
    }
    $('<div/>', {
      id: index,
      "class" : "span4",
      html: '<h3>' + title + '</h3>' + description
    }).appendTo('#' + currentIndex);
  });
});
于 2013-05-13T19:34:47.207 回答