jQuery克隆单击添加更多按钮，如果我选择上一行日期未更新，并且单击删除时，顶部总结果值未减少

Question

目前，我正在使用jquery clone并使用日期选择器计算从日期到显示在面板顶部的日期。 使用我的当前代码，我可以克隆该行并添加两个日期值，但是当我单击Delete按钮时，它正在删除克隆的行，但是并没有更新示例顶部的总结果标签。

这是我的删除按钮代码：

$(document).on('click', ".btn_less1", function() {
  var len = $('.cloned-row3').length;
  if (len > 1) {
    var RemoveStartDate = $(this).closest(".btn_less1").parent().parent().parent().find('.startDate ').val();
    var RemoveEndDate = $(this).closest(".btn_less1").parent().parent().parent().find('.endDate  ').val();

    if ((RemoveStartDate != '') || (RemoveEndDate != '')) {
      var dateStartArray = RemoveStartDate.split('/'),
        dateEndArray = RemoveEndDate.split('/');
      var fromdate = new Date(dateStartArray[2], dateStartArray[0] - 1, dateStartArray[0]),
        todate = new Date(dateEndArray[2], dateEndArray[0] - 1, dateEndArray[0]);

      var yearsDifference = todate.getFullYear() - fromdate.getFullYear();
      var monthsDifference = (todate.getMonth() + 12 * todate.getFullYear()) - (fromdate.getMonth() + 12 * fromdate.getFullYear());

      var PrevTotalYear = parseInt($("#txt_expy>span").text());
      var PrevTotalMonth = parseInt($("#txt_expm>span").text());


      $("#txt_expy>span").text('');
      $("#txt_expm>span").text('');

      PrevTotalYear = PrevTotalYear * 12;

      var CurTotalYear = Math.floor(((PrevTotalYear + PrevTotalMonth) - monthsDifference) / 12);
      var CurTotalMonth = (monthsDifference - PrevTotalMonth) % 12;


      $("#txt_expy>span").text(CurTotalYear);
      $("#txt_expm>span").text(CurTotalMonth);
      $(this).closest(".btn_less1").parent().parent().parent().remove();
    } else {
      $(this).closest(".btn_less1").parent().parent().parent().remove();
    }
  }
});

当用户选择日期为12/01/2000以及日期为12/01/2003时

其结果将是总的工作经验3年0个月

如果用户单击添加更多按钮，它将创建另外一行

从日期12/01/2004到日期12/01/2015

结果将是使用我的代码获得的总工作经验15年0个月。 这按我预期的那样工作。

当用户单击删除按钮时，它将删除该行，但不会更新总工作经验；如果单击“添加更多”按钮，如果我尝试修改以前的日期，并且至今也没有更新，则该行也不会更新。

这是小提琴链接

提前致谢

Answer 1

您的问题是原始HTML像这样开始：

<label class="years_lab" id="txt_expy"><span>0</span>Years</label>

更改值时，可以这样设置值：

document.getElementById("txt_expy").innerHTML

这将设置标签的内部并删除span元素。 当您尝试重新计算总数时，您可以像这样选择它：

$("#txt_expy>span")

但这将返回一个空的jQuery对象，因为该范围不再存在。

小提琴： http : //jsfiddle.net/bqgjro6d/41/

我将最后两行更改为：

document.getElementById("txt_expy").innerHTML = diffYears;
document.getElementById("txt_expm").innerHTML = diffMonths;

至：

$("#txt_expy>span").text(diffYears);
$("#txt_expm>span").text(diffMonths);