Question

目前我正在使用jquery clone并使用日期选择器计算显示在面板顶部的日期和日期。使用我的修改代码，我能够克隆行并添加两个日期值，但是当我单击删除按钮时，它将删除克隆的行，但它不会更新示例顶部的总结果标签。

以下是我的删除按钮代码：

$(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月

如果用户点击添加更多按钮，则会再创建一行

再次从2004年1月12日起到2015年1月12日为止

结果将是总工作经验15年和我的代码0月。这可以像我期望的那样工作。

当用户点击删除按钮时，它正在删除该行，但它没有更新总体工作体验，如果我尝试修改上一个从日期到日期，则单击添加更多按钮，结果不会更新任

以下是fiddle link

提前致谢

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);

如果我选择上一行日期不更新，则单击JQuery clone单击添加更多按钮，单击删除时，顶部总结果值不会减少

1 个答案: