Jquery日期计算不工作的克隆

Jquery Date calculation not working on clone

本文关键字:工作 日期 计算 Jquery      更新时间:2023-09-26

目前正在使用jquery日期选择器计算从日期到日期的体验。例如(如果用户选择日期01/05/2010 (from) - (To) 31/07/2013——结果将是3年零3个月)结果将以标签格式显示。同样,当用户单击add more按钮时,这里将生成另一行,用户也输入from日期和to日期。结果将是这两行(如果用户选择日期01/05/2010 (from) - (To) 31/07/2013 -结果将是6年零6个月)它必须计算这两行。

这是为当前计算编写的Jquery代码

   $(document).on('change', "#txt_Tdob", function (){
    var date1 = document.getElementById("txt_Fdob").value;
    var date2 = document.getElementById("txt_Tdob").value;
    var x = date1.split("-");
    var y = date2.split("-");
    var fromdate = new Date(x[2], x[0] - 1, x[1]);
    var todate = new Date(y[2], y[0] - 1, y[1]);
    var diffDays = parseInt((todate - fromdate) / (1000 * 60 * 60 * 24));
    var year = parseInt(diffDays / 365);
    var date = diffDays - (365 * year);
    var month = parseInt(date / 30);
    document.getElementById("txt_expy").innerHTML = year + " year";
    document.getElementById("txt_expm").innerHTML = month + " Month";
});

这是更新后的小提琴

注意:根据这个fiddle链接,当用户第一次点击日期选择器时,只有当用户从第二次点击添加更多按钮时,它才会不起作用

请帮帮我

谢谢,问候马哈德文

好的,这里是为您更新的代码,请注意,未来日期的验证尚未完成。我的意思是,如果你选择未来一年,它只会把它添加到总经验中,你需要把你的代码改进得更好,因为它可能仍然包含克隆的id。我刚刚在这里展示了如何实现该功能。

$(document).on('change', ".datepicker", function (){
    //.datepicker is a common class for all datepickers and change in any datepicker will trigger this
    var valid=true;//check if all the datepickers have been selected
    $.each($('.datepicker'),function(){
        if($(this).val()=="")//if any of datepickers value is null do not add
        {
            valid=false;//set valid to false and return
            return false;
        }
     });
     if(valid)//only if it is valid perform adding operation
     {
        var dateStart=[];//create an array to store startDate
        var dateEnd=[];//and endDate
        $.each($('.datepicker'),function(){
            if($(this).hasClass('startDate')) //if the current control is startdate push it to corresponding array
                dateStart.push($(this).val())
            else
                dateEnd.push($(this).val())
        });
        $.each($(dateStart),function(key,value){
            var x = dateStart[key].split("-"); //get first startdate from array
            var y = dateEnd[key].split("-"); //get first enddate from array
            var fromdate = new Date(x[2], x[0] - 1, x[1]);
            var todate = new Date(y[2], y[0] - 1, y[1]);
            diffDays+= parseInt((todate - fromdate) / (1000 * 60 * 60 * 24));
            //diffDays is now a global variable which is declared in document.ready. 
            //You can find it in fiddle
        });
        var year = parseInt(diffDays / 365);
        var date = diffDays - (365 * year);
        var month = parseInt(date / 30);    
        document.getElementById("txt_expy").innerHTML = year + " year";
        document.getElementById("txt_expm").innerHTML = month + " Month";
        //rest all things down here remains same.
     }
});

HTML已经更新了一点。请查看

是的,我已经这样做了,我肯定会给你提供代码。

我有两个日期字段:Date From &日期:

Jquery

$(document).ready(function(){
$('input[id*=DateFrom]').datepicker({ dateFormat: 'dd-M-yy' }, { changeMonth: true }, { changeYear: true });
$('input[id*=DateTo]').datepicker({ dateFormat: 'dd-M-yy' }, { changeMonth: true }, { changeYear: true });
});
//Re-create ID for neccessary controls //Here i am changing the id's of cloned elements
tbodyElement.find("#DateFrom" + LstCount).attr('id', 'DateFrom' + varCount);
tbodyElement.find("#DateTo" + LstCount).attr('id', 'DateTo' + varCount);
//input field
<%= Html.TextBox("DateFrom", item.DateFrom.ToString("dd-MMM-yyyy"), new { @id = "DateFrom" + cnt  })%>
//Date To
<%= Html.TextBox("DateTo", item.DateTo.ToString("dd-MMM-yyyy"), new { @id = "DateTo" + cnt })%>