2

我将 jQueryDatepicker用于两个不同的文本字段。一个字段用于开始日期，另一个字段用于结束字段。我使用禁用当前日期之前的日期minDate。我的代码是这样的：

$( "#start" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
});    

$( "#end" ).datepicker({
    minDate: 0,
    dateFormat: 'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
});

现在我需要检查结束日期是否必须等于或大于开始日期。在结束日期字段中，必须禁用所选开始日期之前的所有日期。如何做呢？

4

4 回答 4

1

这是所需代码的示例。

<script>
    $(function() {
        var dates = $( "#from, #to" ).datepicker({
            defaultDate: "+1w",
            changeMonth: true,
            numberOfMonths: 3,
            onSelect: function( selectedDate ) {
                var option = this.id == "from" ? "minDate" : "maxDate",
                    instance = $( this ).data( "datepicker" ),
                    date = $.datepicker.parseDate(
                        instance.settings.dateFormat ||
                        $.datepicker._defaults.dateFormat,
                        selectedDate, instance.settings );
                dates.not( this ).datepicker( "option", option, date );
            }
        });
    });
    </script>

您可以在以下位置查看演示：Datepicker

引用自 Jquery UI 网站。

于 2012-05-24T06:18:36.637 回答
1

首先感谢所有帮助我找到答案的人。

我的问题的解决方案是使用以下代码：

$(document).ready(function(){
  $("#depart ,#return_date").datepick({
    minDate:0,
    dateFormat:'yyyy-mm-dd',
    showOnFocus: true,
    showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />',
    onSelect: customRange
  });

  function customRange(dates) {
    if (this.id == 'depart')
    {
      $('#return_date').datepick('option', 'minDate', dates[0] || null);
    }
    else
    {
      $('#depart').datepick('option', 'maxDate', dates[0] || null);
    }
  }
});
于 2012-05-25T04:25:22.910 回答
0

使用 datejs 库进行复杂的与日期相关的操作 --> datejs.com

于 2012-05-24T05:37:06.020 回答
0

当开始日期更改时，您需要重置结束日期。这应该这样做。

<script type="text/javascript">
    $(document).ready(function () {
        $('#start').datepicker({
            minDate: '-1d',
            dateFormat: 'yy-mm-dd',
            showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
        });

        $('#end').datepicker({
            minDate: '-1d',
            dateFormat: 'yy-mm-dd',
            showTrigger: '<img src="<?php echo base_url()?>images/calender.png" />'
        });

        $('#start').change(function () {
            var sDate = $('#start').val().split("-");
            var endMinDate = new Date(sDate[0], sDate[1] - 1, sDate[2]);
            $('#end').datepicker('option', 'minDate', endMinDate);
        });
    }); 
</script>
于 2012-05-24T06:18:41.053 回答