jQuery each()方法不适用于附加元素

时间:2019-08-14 14:17:00

标签: javascript jquery append each

我正在尝试将tr及其内部标签附加到我的表中。准备好文档后,将发生此功能。然后使用一种.each()方法,我试图将一些类添加到附加的tr元素中。但似乎jQuery无法识别我附加的html内容。我应该怎么解决我的问题?谢谢大家。

我要附加它们的html内容:

let appndContent = '<tr class="RoomTableTr" style="background-color: red;">\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2 borderedTd">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
  '<td class="RoomTableTd v2">\n' +
    '<p class="costPerDays costInTable"></p>\n' +
    '<p class="costPerDays">ریال</p>\n' +
  '</td>\n' +
'</tr>';

$('.DepartureDate').each(function() {
  let day = parseInt($(this).val().substring(8, 10)),
    month = parseInt($(this).val().substring(5, 7)),
    year = parseInt($(this).val().substring(0, 4)),
    DayOfWeek = new persianDate();
  DayOfWeek.date(day);
  DayOfWeek.month(month);
  DayOfWeek.year(year);
  let TheDay = DayOfWeek.format('dddd');

  let CostInf = $(this).parent().parent().find('.CostInf').val();
  switch (TheDay) {
    case 'شنبه':
      $(".RoomTableTr td:nth-child(1) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'یکشنبه':
      $(".RoomTableTr td:nth-child(2) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'دوشنبه':
      $(".RoomTableTr td:nth-child(3) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'سه شنبه':
      $(".RoomTableTr td:nth-child(4) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'چهار شنبه':
      $(".RoomTableTr td:nth-child(5) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'پنج‌شنبه':
      $(".RoomTableTr td:nth-child(6) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    case 'جمعه':
      $(".RoomTableTr td:nth-child(7) .costInTable").empty().append(CostInf).parent().addClass('DepartureDateMark');
      break;
    default:
      break;
  }
  let lastDay = $(this).parent().find('.DepartureDateMark').last();
  lastDay.attr('data-lastDay', true);
  lastDay.addClass('data-lastDay');
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

1 个答案:

答案 0 :(得分:1)

您应该在切换用例(例如,每个函数之前)之前附加变量“ appndContent”。如果您在切换大小写之后附加或尚未附加,则此查询将不起作用。