Question

我的代码中有一个非常奇怪的问题。我试图在这里问，但似乎没有人找到这个问题的逻辑。

我会粘贴我的代码：

$(document).ready(function(){
        var max = 5;
        var d = new Date();
        var today = $.format.date(d, 'yyyy-MM-ddTHH:mm:ss');
        d.setDate(d.getDate() - 1);
        var yesterday = $.format.date(d, 'yyyy-MM-ddTHH:mm:ss');
        var querys = {
            'upcoming' : 'https://www.google.com/calendar/feeds/user/private-magic-cookie/full?alt=jsonc&v=2&start-index=1&max-results='+ max +'&orderby=starttime&sortorder=ascending&start-min=' + today ,
            'previous': 'https://www.google.com/calendar/feeds/user/private-magic-cookie/full?alt=jsonc&v=2&start-index=1&max-results='+ max +'&orderby=starttime&sortorder=descending&start-max=' + yesterday
        };
        var items = [];             
        $.each(querys, function(key, val) {
            items[key] = [];
            var typeOfEvent = key;
            $.getJSON(val, function(data) {             
                $.each(data.data.items, function(key, val) {                    
                    var when = $.format.date(val.when[0].start, 'dd-MM-yyyy HH:mm');        
                    if (when.search('/:/') == -1) //If no hours where indicated at the event
                        when = when.replace(/(\d{4})-(\d\d)-(\d\d)/, '$3-$2-$1');
                    items[typeOfEvent].push('<li id="' + key + '">' + val.title + ': El ' + when + '</li>');            
                });
            });
        });
        console.log(items); 
        $.each(items, function(key, val){
        var append = $('<ul/>').text(val.join(''));
        $(append).appendTo('body');
    });

    });

所以，最后一部分，那个应该将数组作为列表附加到正文的人并没有做任何事情。没有错误，没有执行代码。您之前看到的console.log，在控制台上完美地输出数组......

那么，这里有什么问题？

Answer 1

我认为应该是：

$.each(items, function(key, val) {
    var append = '<ul>'+val.join('')+'</ul>';
    $(append).appendTo('body');
});

您将项目视为选择器，而不是数组。你还必须用jQuery函数包围你要附加的HTML - 普通旧字符串上没有appendTo方法：）

Answer 2

我发现该循环存在两个问题：

您正在使用.each方法而不是$.each方法，因此您正在使用items数组，就好像它是一个DOM元素数组。
您正在创建一个字符串，但之后您将其用作jQuery对象。 String对象中没有appendTo方法。

您可以使用jQuery创建元素，而不是创建要解析的HTML代码：

$.each(items, function (key, val){
  var append = $('<ul/>').html(val.join(''));
  append.appendTo('body');
});

编辑：

当使用AJAX获取数据时，此代码运行时数组将为空。你必须将代码放在回调中，并确保它只运行最后一次回调：

$(document).ready(function(){
  var max = 5, d = new Date();
  var today = $.format.date(d, 'yyyy-MM-ddTHH:mm:ss');
  d.setDate(d.getDate() - 1);
  var yesterday = $.format.date(d, 'yyyy-MM-ddTHH:mm:ss');
  var querys = {
    'upcoming' : 'https://www.google.com/calendar/feeds/user/private-magic-cookie/full?alt=jsonc&v=2&start-index=1&max-results='+ max +'&orderby=starttime&sortorder=ascending&start-min=' + today ,
    'previous': 'https://www.google.com/calendar/feeds/user/private-magic-cookie/full?alt=jsonc&v=2&start-index=1&max-results='+ max +'&orderby=starttime&sortorder=descending&start-max=' + yesterday
  };
  var items = {}, cnt = 0;
  $.each(querys, function(key, val) {
    items[key] = [];
    var typeOfEvent = key;
    cnt++; // count the requests
    $.getJSON(val, function(data) {             
      $.each(data.data.items, function(key, val) {                    
        var when = $.format.date(val.when[0].start, 'dd-MM-yyyy HH:mm');        
        if (when.search('/:/') == -1) //If no hours where indicated at the event
          when = when.replace(/(\d{4})-(\d\d)-(\d\d)/, '$3-$2-$1');
        items[typeOfEvent].push('<li id="' + key + '">' + val.title + ': El ' + when + '</li>');            
      });
      if (--cnt == 0) { // check for last request
        console.log(items); 
        $.each(items, function(key, val){
          $('<ul/>').html(val.join('')).appendTo('body');
        });
      }
    });
  });
});

Answer 3

这应该可以解决你的问题...

$(append).appendTo('body');

or 

$('body').append(append)

Javascript“.each”不是循环遍历数组

3 个答案:

编辑：