在页面加载时启动datepicker代码

时间:2012-04-04 03:25:29

标签: php jquery datepicker

我有两个日期选择器。选择开始日期后,x天后将通过php自动分配结束日期。这很好,但我有一个问题。执行此工作的jQuery代码,我希望在刷新/加载页面时启动它(开始日期保存在php会话中)。这是我的代码:

$(document).ready(function(){
    $("#txtStartDate").datepicker({
        onSelect: function(){
        var datum = $(this).datepicker('getDate');
        datum.setDate(datum.getDate() + <?php echo $nights; ?>);
        $("#txtEndDate").datepicker("setDate", new Date(datum.getTime()));
        }
    });
    $("#txtEndDate").datepicker();
}); 

我正在考虑使用&#34; onSelect,onLoad:funct ...&#34;。

这是如何实现的?

3 个答案:

答案 0 :(得分:1)

创建一个单独的函数来设置结束日期,然后在onLoad事件上调用它。

function setEndDate(){
    var datum = $("#txtStartDate").datepicker('getDate');
    datum.setDate(datum.getDate() + <?php echo $nights; ?>);
    $("#txtEndDate").datepicker("setDate", new Date(datum.getTime()));
}

然后<body onLoad="setEndDate();">

答案 1 :(得分:0)

$("#txtStartDate").trigger('focus');添加到结尾

$("#txtStartDate").datepicker({
    onSelect: function() {
        var datum = $(this).datepicker('getDate'),
            days = 2,
            d = new Date(datum.getTime() + (days * 86400000)),
            month = parseInt(d.getMonth(), 10)+1 < 10 ? '0'+ (parseInt(d.getMonth(), 10)+1) : parseInt(d.getMonth(), 10)+1,
            day = d.getDate() < 10 ? '0'+ d.getDate() : d.getDate(),
            year = d.getFullYear();
        $("#txtEndDate").val(month+'/'+day+'/'+year);
    }
});
$("#txtEndDate").datepicker();
$("#txtStartDate").trigger('focus');

更新。更改变量天数以提前几天设置结束日期。

答案 2 :(得分:0)

尝试删除document.ready并将其放在脚本标记内。

<script type="text/javascript">

 $("#txtStartDate").datepicker({
        onSelect: function(){
        var datum = $(this).datepicker('getDate');
        datum.setDate(datum.getDate() + <?php echo $nights; ?>);
        $("#txtEndDate").datepicker("setDate", new Date(datum.getTime()));
        }
    });
    $("#txtEndDate").datepicker();

 </script>

如果上述方法无法解决您的问题,请尝试在开始日期选择器中设置defaultDate: new Date,如下所示

$(function () {
    $.datepicker.setDefaults({
        //Set your common attributes here for both date pickers
    });

    var dateFrom = $('#txtStartDate').datepicker({ defaultDate : new Date,
        onSelect: function (selectedDate) {
            dateTo.datepicker('option', 'defaultDate', dateFrom.datepicker('getDate')+[ x days //add days according to your need]);
        }
    });  

    var dateTo = $('#txtEndDate').datepicker();  
});