jquery.append() - 只附加我列表的最后一个元素，之前的元素被删除答案

【问题标题】：jquery.append() - only the last element of my list is appended, previous ones are erasedjquery.append() - 只附加我列表的最后一个元素，之前的元素被删除
【发布时间】：2010-05-31 09:15:25
【问题描述】：

我有一个这样的页面：

<div id="daysTable">
    <div id="day0" class="day"></div>
    <div id="day1" class="day"></div>
    <div id="day2" class="day"></div>
    <div id="day3" class="day"></div>
    <div id="day4" class="day"></div>
    <div id="day5" class="day"></div>
    <div id="day6" class="day"></div>
</div>

还有一些 javascript 像这样填写我的日历

function getWeek(){
    $.getJSON("/getWeek",function(events){
        var eventHeight = $("#hoursTable > div").height();
        var eventWidth = $("#daysTable > div").width();
        var startWeek = events[0]// timestamp of the start of the week
        for(var i = 1; i < events.length; i ++){
            $(".day").empty();
            var startHour = (events[i].startDate - startWeek)/3600
            var duration = (events[i].stopDate - startWeek)/3600 - startHour
            var dayStart = Math.floor(startHour/24);
            var startHour = startHour - dayStart * 24
            divEvent = $('<div id="event'+events[i].idEvent+'"/>')
                .width(eventWidth-2)
                .height(duration*eventHeight)
                .css("border","1px solid black")
                .css("margin-top",startHour*eventHeight)
                .html(events[i].name);
            divEvent.appendTo("#day"+dayStart);
            console.log(divEvent);
        }
    });
}

我的问题是：事件包含我想显示的 3 个元素，但只显示最后一个。如果我在第一次迭代时停止“for”，我可以看到附加的第一个 div，但似乎如果我的循环进行三次迭代，则前两个被删除。 console.log() 显示一些“不再”存在的元素。有什么想法吗？

【问题讨论】：

您可能希望避免直接在 javascript 中设置边框和边距等样式，因为如果设计发生变化，这些样式可能会发生变化。相反，使用 addClass() 向元素添加类，然后让外部 CSS 文件决定日历的外观。

标签： javascript jquery html

【解决方案1】：

通过在循环顶部调用$(".day").empty();，您将在添加每个新事件之前删除所有事件。

您需要将该行移到 for 循环之前。

【讨论】：

【解决方案2】：

在您的循环中，您正在调用 $(".day").empty();，这将删除之前迭代中添加的任何内容...您需要将其移到 for 循环之外/之前，这样它就不会再这样做了。

所以这个：

    for(var i = 1; i < events.length; i ++){
        $(".day").empty();

应该是这样的：

    $(".day").empty();
    for(var i = 1; i < events.length; i ++){

【讨论】：

该死的，以为我花了半天时间-_-'谢谢大家，我现在应该暂停一下

【解决方案3】：

我们可以看到你的"/getWeek" json....的返回结构吗？

因为我认为问题在于function(events){...} 中，events 不是数组...

我认为你应该有类似events.data.length，然后是events.data[i].somevariable

【讨论】：