IE11 java脚本on-change事件不能与html表单元素一起使用

时间:2016-08-22 08:41:42

标签: javascript jquery javascript-events internet-explorer-11 html-form

我正在为记录休假日期做简单的申请。通过此应用程序,我可以选择休假的开始日期和结束日期,然后计算这两天之间的所有营业日期。到目前为止,我的代码工作铬和firefor完美。我正在使用Jquery UI日期选择器选择两个日期,并使用第二个日期选择器on-change事件计数日期并将其显示在html输入框中。 使用IE,这个功能被破坏,在我使用日期时间选择器on-change事件未触发

设置两个日期之后

这是我的代码示例

<script type="text/javascript">
              $( function() {
                $( "#startd" ).datepicker({beforeShowDay: $.datepicker.noWeekends , dateFormat: 'yy-mm-dd'});
              } );

              $( function() {
                $( "#endd" ).datepicker({beforeShowDay: $.datepicker.noWeekends , dateFormat: 'yy-mm-dd' });
              } );

 function getBusinessDatesCount(startDate, endDate) {
    var count = 0;
    var curDate = startDate;
    while (curDate <= endDate) {
        var dayOfWeek = curDate.getDay();
        if(!((dayOfWeek == 6) || (dayOfWeek == 0)))
           count++;
        curDate.setDate(curDate.getDate() + 1);
    }
    return count;
}
            </script>


            <form action='reqprocess.php' method='post'>
                <table class='table table-hover table-responsive table-bordered'>
            <tr>
                        <td id="td2">Start</td>
                        <td><input type="text" name="datepicker" class='form-control' id="startd" required onchange="calnumofdays()" /></td>
                    </tr>
                      <tr>
                        <td id="td1">End</td>
                        <td><input type="text" name="datepicker2" class='form-control' id="endd" onchange="calnumofdays()" /></td>
                    </tr>
                     <tr>
                        <td>Days</td>
                        <td><input type="number" name='leavehmd' class='form-control' id="lhmd"/></td>
                    </tr>
                </table>
            </form>

    <script type="text/javascript">

            function calnumofdays() {           

            var startDate = $(startd).datepicker("getDate");
            var endDate = $(endd).datepicker("getDate");

            var numOfDates = getBusinessDatesCount(startDate, endDate);
            $('#lhmd').val(numOfDates);
            //alert(numOfDates);
            $('div#result').text(numOfDates);
          }
        </script>

我该如何解决这个问题?这段代码在chrome和firfox中运行得非常好。当我在html中删除表单标签时,它也开始在IE中工作。

1 个答案:

答案 0 :(得分:0)

在calnumofdays上编辑这些部分,它会起作用......

function calnumofdays() {           

            var startDate = $("#startd").datepicker("getDate"); //edit these
            var endDate = $("#endd").datepicker("getDate"); //edit these

            var numOfDates = getBusinessDatesCount(startDate, endDate);
            $('#lhmd').val(numOfDates);
            //alert(numOfDates);
            $('div#result').text(numOfDates);
          }