jQuery UI Datepicker - 日期之间的天数

时间:2012-03-07 05:45:28

标签: jquery jquery-ui datepicker

我正在使用jQuery UI Datepicker。我有两个日期字段。我想找到两个日期之间的天数差异。

一旦我有了天数,我想把这些数字放在文本字段中。

非常感谢您对此问题的任何帮助。

干杯。

3 个答案:

答案 0 :(得分:5)

您可以使用onselect事件来获取日期。

$('#date1').datepicker({
   onSelect: function(dateText, inst) { 
       var d1=new Date(dateText);
       // get date from other text field
       var d2=new Date($('#date2').val());
       // d2 -d1 gives result in milliseconds
       // calculate number of days by Math.abs((d2-d1)/86400000, as 24*3600*1000 = 86400000
       // and populate it to some text field #textfield
       $('#textfield').val((Math.abs((d2-d1)/86400000)));
   }
}); 

答案 1 :(得分:2)

我用dateRange Datepicker解决了它而不是使用2个不同的Datepickers然后我计算了该范围内的天数,并根据需要将其回复到文本字段中。我希望它有所帮助。

<强> HTML

<form>
    <label>From</label>
    <input id="from" readonly="readonly" name="from" type="text" value="">
    <label>To</label>
    <input id="to" readonly="readonly" name="to" type="text" value="">
    <label>Days</label>
    <input id="days" readonly="readonly" name="days" type="text" value="">
</form>

jQuery UI

<script>
var from = new Date();
var to = new Date();
var dayDiff = 1;

$(function() {
var dates = $( "#from, #to" ).datepicker({
    defaultDate: "+1w",
    changeMonth: true,
        numberOfMonths: 1,
        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 );

            if (this.id == "from"){
                from = $(this).datepicker('getDate');
                if (!(to == "")){
                    update_days()
                }
            }
            if (this.id == "to"){
                to = $(this).datepicker('getDate');
                update_days()
            }
        }
    });
});

function update_days(){
    dayDiff = Math.ceil((to - from) / (1000 * 60 * 60 * 24));
    $("#days").empty()
    $("#days").append(dayDiff)
}
</script>

答案 2 :(得分:2)

您需要了解在日期之间获取天数的基本公式,请查看here

  
    

谷歌搜索“两个日期之间的天数javascript”生成this great snippet(实际上所有顶级结果都与您的相关     问题):

var oneDay = 24*60*60*1000; // hours*minutes*seconds*milliseconds
var firstDate = new Date(2008,01,12);
var secondDate = new Date(2008,01,22);

var diffDays = Math.round(Math.abs((firstDate.getTime() - secondDate.getTime())/(oneDay)));
  
     

&GT; (这取自stackoverflow答案,详细信息请查看here

使用以下代码获取天数之间的日期

function showDays() {
    var start = $('#arr_date').datepicker('getDate');
    var end = $('#dep_date').datepicker('getDate');
    if (!start || !end) return;
    var days = (end - start) / 1000 / 60 / 60 / 24;
    $('#num_nights').val(dayss);
}

$("#arr_date").datepicker({
    dateFormat: 'dd-mm-yy',
    onSelect: showDays,
     onClose: function( selectedDate ) {
         var dParts = selectedDate.split('-');
         var in30Days = new Date(dParts[2] + '/' +
                        dParts[1] + '/' +
                        (+dParts[0] + 30)
               );

    $( "#dep_date" ).datepicker( "option", "minDate", in30Days );
    }
});
$("#dep_date").datepicker({
    dateFormat: 'dd-mm-yy',
    onSelect: showDays,

});

以下是MYFIDDLE