Javascript 使用jsp计算两个日期之间的月份和年份,在duration文本框中显示值

Javascript 使用jsp计算两个日期之间的月份和年份,在duration文本框中显示值,javascript,html,jsp,Javascript,Html,Jsp,其中st和en是文本框的id,包含开始日期和结束日期 <html> <head> <script language="javascript" type="text/javascript" src="datetimepicker_css.js"></script> </head> <body bgcolor="#c8c4c4"> <center>

其中st和en是文本框的id,包含开始日期和结束日期

<html>

    <head>
        <script language="javascript" type="text/javascript" src="datetimepicker_css.js"></script>
    </head>

    <body bgcolor="#c8c4c4">
        <center>
            <div id="content" style="background-color:#f1f1f1;height:auto;width: 80%;float: inside;">
                <form class="demo" name="" method="post" action="connection.jsp">
                    <table align="center">
                        <tr>
                            <td>
                                <h2 align="center"><font style="font-weight: bold;size:10;">Employee Database</font></h2> 
                                <table align="center" bgcolor="#f1f1f1" width="800" border="2" cellpadding="4" cellspacing="3">
                                    <tr>
                                        <th>From Date</th>
                                        <th>To Date</th>
                                        <th>Duration</th>
                                        <tr>
                                            <td>
                                                <input type="text" name="fromdate" id="demo3" maxlength="20" style="float:left" size="14">
                                                <img src="images2/cal.gif" onclick="javascript:NewCssCal('demo1', 'ddMMyyyy', 'dropdown', true, '12', true)" style="cursor:pointer;float:left;" />
                                            </td>
                                            <td>
                                                <input type="text" name="to_date" id="demo3" maxlength="20" style="float:left" size="14">
                                                <img src="images2/cal.gif" onclick="javascript:NewCssCal('demo1', 'ddMMyyyy', 'dropdown', true, '12', true)" style="cursor:pointer;float:left;" />
                                            </td>
                                            <td>
                                                <input type="text" name="duration">
                                            </td>
                                        </tr>
                                </table>
                            </td>
                            </tr>
                    </table>
                </form>
            </div>
function caldur(val)
        {
                var d1 = new Date(document.getElementById("st").value); //from date yyyy-MM-dd
                var d2 = new Date(document.getElementById("en").value); //to date yyyy-MM-dd (taken currentdate)
                var Months = d2.getMonth() - d1.getMonth();
                var Years = d2.getFullYear() - d1.getFullYear();
                var Days = d2.getDate() - d1.getDate();
                Months = (d2.getMonth() + 12 * d2.getFullYear()) - (d1.getMonth() + 12 * d1.getFullYear());
                var MonthOverflow = 0;
                if (Months - (Years * 12) < 0)
                    MonthOverFlow = -1;
                else
                    MonthOverFlow = 1;
                if (MonthOverFlow < 0)
                    Years = Years - 1; Months = Months - (Years * 12);
                var LastDayOfMonth = new Date(d2.getFullYear(), 
                        d2.getMonth() + 1, 0, 23, 59, 59);
                LastDayOfMonth = LastDayOfMonth.getDate();
                if (MonthOverFlow < 0 && (d1.getDate() > d2.getDate())) {
                    Days = LastDayOfMonth + (d2.getDate() - d1.getDate()) - 1;
                }
                else
                    Days = d2.getDate() - d1.getDate();
                if (Days < 0)
                    Months = Months - 1;
                var l = new Date(d2.getFullYear(), d2.getMonth(), 0);
                var l1 = new Date(d1.getFullYear(), d1.getMonth() + 1, 0);
                if (Days < 0) 
                {
                    if (l1 > l)
                        Days = l1.getDate() + Days;
                    else
                        Days = l.getDate() + Days;
                }
                if(Years<0 || Months<0 || Days<0)
                {
                    alert("End date should be bigger than start date");
                    return;
                }
               document.getElementById("dr").value=Years + "Y(s), " + Months + " M(s), " + Days + "D(s)";

        }