看起来我的每个循环不止一次循环

时间:2016-03-16 19:23:50

标签: javascript jquery each

下面的代码应该从cookie中读取存储的ID(保存在cookie中,这样如果你重新加载页面,它会将你保存的会话存储在cookie中,以便下次读取),查找链接的DIV到该ID,并将行附加到具有ID所用会话的标题,日期,代码和时间的表中,但是当有多个日期链接到单个会话DIV时,它应为每个会话DIV创建一行,其中似乎做得很好。

但是,似乎sessDateVar.each(function( i, val )的每个循环都运行了两次?当我console.log当前会话代码和在while循环中追加的行的日期,以及i的值似乎重复?我似乎无法弄清楚这一点。

现在代码有点乱,对不起!如果我遗漏了任何东西,请告诉我!

while循环运行时我的控制台的内容

(index):1994 Wrote a row for session A6 on date Wednesday, May 18, 2016
(index):1995 0
(index):1994 Wrote a row for session D6 on date Thursday, May 19, 2016
(index):1995 1
(index):1994 Wrote a row for session A6 on date Wednesday, May 18, 2016
(index):1995 0
(index):1994 Wrote a row for session D6 on date Thursday, May 19, 2016
(index):1995 1
(index):1994 Wrote a row for session C6 on date Wednesday, May 18, 2016
(index):1995 0
(index):1994 Wrote a row for session F6 on date Thursday, May 19, 2016
(index):1995 1
(index):1994 Wrote a row for session C6 on date Wednesday, May 18, 2016
(index):1995 0
(index):1994 Wrote a row for session F6 on date Thursday, May 19, 2016
(index):1995 1

守则

 function writeTable() {
  if (checkCookie() === false) {
    $('#table-container').append('<table class="tg" id="session-table">\n<thead>\n<tr>\n<th class="tg-yw4l">Session</th>\n<th class="tg-yw4l">Date</th>\n<th class="tg-yw4l">Time</th>\n<th class="tg-yw4l"></th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
    $('.table-container-export').append('<table class="tg" cellpadding="10" id="session-table-export">\n<thead>\n<tr>\n<th class="tg-title">Session</th>\n<th class="tg-info">Date</th>\n<th class="tg-info">Time</th>\n<th class="tg-info">Session Code</th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
  } else if (checkCookie() === true) {
    var askToLoad = confirm('You have saved sessions in your browser, would you like to load those sessions?');
    if (askToLoad === true) {

      $('#table-container').append('<table class="tg" id="session-table">\n<thead>\n<tr>\n<th class="tg-yw4l">Session</th>\n<th class="tg-yw4l">Date</th>\n<th class="tg-yw4l">Time</th>\n<th class="tg-yw4l"></th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
      $('.table-container-export').append('<table class="tg" cellpadding="10" id="session-table-export">\n<thead>\n<tr>\n<th class="tg-title">Session</th>\n<th class="tg-info">Date</th>\n<th class="tg-info">Time</th>\n<th class="tg-info">Session Code</th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
      var tableDataUnparsed = Cookies.get('session-table');
      var tableDataExportUnparsed = Cookies.get('session-table-export');
      var tableDataParsed = JSON.parse(tableDataUnparsed);
      var tableDataExportParsed = JSON.parse(tableDataExportUnparsed);
      var tableDataExport = tableDataExportParsed;

      $.each(tableDataExportParsed, function( i, val ){
        var sessID = val;
        var sessionToFind = $(sessID);
        var sessTitle = sessionToFind.find('.title').html();
        var sessDateVar = sessionToFind.find('.date');
          if (sessDateVar.size() > 1) {
            var sessDates = [];
            sessDateVar.each(function() {
              sessDates.push($.trim($(this).html()));
            });
          } else {
            var sessDate = $.trim(sessionToFind.find('.date').html());
            var sessDates = false;
          }
        var sessTimeVar = sessionToFind.find('.time');
          if (sessTimeVar.size() > 1) {
            var sessTimes = [];
            sessTimeVar.each(function() {
              sessTimes.push($.trim($(this).html()));
            });
          } else {
            var sessTime = $.trim(sessionToFind.find('.time').html());
          }
        var sessCodeVar = sessionToFind.find('.code');
          if (sessCodeVar.size() > 1) {
            var sessCodes = [];
            sessCodeVar.each(function() {
              sessCodes.push($.trim($(this).html()));
            });
          } else {
            var sessCode = $.trim(sessionToFind.find('.code').html());
          }


        if (sessDates === false) {
          $('#session-table-export').append('<tr data-sessionID=' + sessID + '>\n<td width="210px" style="width:210px" class="tg-title" ><span style="font-size: 12px; font-weight: bold;"> ' + sessTitle + '</span></td>\n<td width="100px" style="width:100px" class="tg-info" > ' + sessDate + '</td>\n<td width="100px" style="width:100px" class="tg-info"> ' + sessTime + '</td>\n<td width="50px" style="width:50px" class="tg-sessioncode">' + sessCode + '</td>\n</tr>\n');
        } else {
          sessDateVar.each(function( i, val ){
            $('#session-table-export').append('<tr data-sessionID=' + sessID + '>\n<td width="210px" style="width:210px" class="tg-title" ><span style="font-size: 12px; font-weight: bold;">' + sessTitle + '</span></td>\n<td width="100px" style="width:100px" class="tg-info" > ' + sessDates[i] + '</td>\n<td width="100px" style="width:100px" class="tg-info">' + sessTimes[i] + '</td>\n<td  width="50px" style="width:50px" class="tg-sessioncode"><p>' + sessCodes[i] + '</p></td></tr>\n');      
          });

        }

      });

      loadedFromCookie = true;

    } else if (askToLoad === false) {
      Cookies.remove('session-table', {
        path: '/isotope'
      });
      Cookies.remove('session-table-export', {
        path: '/isotope'
      });
      $('#table-container').append('<table class="tg" id="session-table">\n<thead>\n<tr>\n<th class="tg-yw41">Session</th>\n<th class="tg-yw4l">Date</th>\n<th class="tg-yw4l">Time</th>\n<th class="tg-yw4l">\n</th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
      $('.table-container-export').append('<table class="tg" cellpadding="10" id="session-table-export">\n<thead>\n<tr>\n<th class="tg-title">Session</th>\n<th class="tg-info">Date</th>\n<th class="tg-info">Time</th>\n<th class="tg-info">Session Code</th>\n</tr>\n</thead>\n<tbody>\n</tbody>\n</table>');
    }
  }
};
writeTable();

有问题的循环

        if (sessDates === false) {
          $('#session-table-export').append('<tr data-sessionID=' + sessID + '>\n<td width="210px" style="width:210px" class="tg-title" ><span style="font-size: 12px; font-weight: bold;"> ' + sessTitle + '</span></td>\n<td width="100px" style="width:100px" class="tg-info" > ' + sessDate + '</td>\n<td width="100px" style="width:100px" class="tg-info"> ' + sessTime + '</td>\n<td width="50px" style="width:50px" class="tg-sessioncode">' + sessCode + '</td>\n</tr>\n');
        } else {
          sessDateVar.each(function( i, val ){
            $('#session-table-export').append('<tr data-sessionID=' + sessID + '>\n<td width="210px" style="width:210px" class="tg-title" ><span style="font-size: 12px; font-weight: bold;">' + sessTitle + '</span></td>\n<td width="100px" style="width:100px" class="tg-info" > ' + sessDates[i] + '</td>\n<td width="100px" style="width:100px" class="tg-info">' + sessTimes[i] + '</td>\n<td  width="50px" style="width:50px" class="tg-sessioncode"><p>' + sessCodes[i] + '</p></td></tr>\n');      
            console.log('Wrote a row for session ' + sessCodes[i] + ' on date ' + sessDates[i] + '');
            console.log(i);
          });

        }

1 个答案:

答案 0 :(得分:0)

问题解决了!这段代码是一个更大的文件的一部分,它执行影响此代码的其他事情。我无法粘贴整个文件,因此我粘贴到相关的部分并试图解释可能影响它的其他部分。

长话短说,tableDataExportParsed包含重复的ID(当它将IDS存储在cookie中时,它看到多个日期并包含每个ID)所以循环和代码完全正常,就是那里确实是重复它再次循环。因此,解决方案是清除tableDataExportParsed,因此它不包含重复项。显然,昨天写完这一切之后,我的大脑就是朋友,并且有这种疏忽。