Question

我卡住了。

我有一个按钮，可以返回有关事件，姓名，日期等信息。

在脚本中它看起来像这样：

for(var i = 0; i < result.length ; i++)
            {
                var item = result[i];                   
                $("#eventList").append("<h3>" + result.eventDate + "</h3>" + "<br>" + result.eventId + "<br>" + result.description + "<br>");
        }

这将生成一个事件列表，这些事件将转到div，即一个div中事件的alla。但我希望每个事件都放在一个单独的div / box中。

有什么想法吗？

Answer 1

您可以在div中创建它们，然后将所有这些都添加到dom的末尾。

var divs = [];
var $div;

results.forEach(function(item){
    $div = $('<div></div>');
    $div.append("<h3>" + item.eventDate + "</h3>");
    $div.append("<br>"+ item.eventId);
    $div.append("<br>"+ item.description);
    divs.push($div);
});

$("#eventList").append(divs);

Answer 2

您可以在for循环中创建项变量。当ii变得过大时，result[ii]将被取消定义或为false，循环将停止。我更喜欢使用ii到i，因为如果我想搜索重复循环，则更容易找到。

每个jQuery操作都会返回它所应用的jQuery对象，因此您可以链接您的操作。您可以创建一个空元素，然后在下一个操作中设置其文本，以使代码更紧凑。

for(var ii=0, item; item=result[ii]; ii++) {
  $("#eventList")
  .append($("<div>")
          .append($("<h3>").text(item.eventDate))
          .append($("<p>").text(item.eventId))
          .append($("<p>").text(item.description))
  )
}

jsFiddle

为每个返回的元素获取一个div

2 个答案: