0

编辑:得到答案的解决方案。

一些专家可以帮助我处理 javascript 代码吗?

我有 eternicode Datepicker 与 bootstrap3 一起使用(单击以选择日期时可以使用) https://github.com/eternicode/bootstrap-datepicker/tree/bs3

但是现在我有两个日期,Checkin 和 Checkout,我想:选择结帐时,它会禁用日期 <= Checkin。选择checkin的时候,如果是checkout之后,把checkout改成checkin选择后+1天。

我有一些html和javascript代码,但效果不太好:当我选择checkin时,checkout day是今天,必须选择checkin + 1day。当我选择结帐时,它只会禁用当天之前的几天,只有当我选择签入日之后的一天时才有效。

似乎结帐的 setValue 存在一些问题。

html代码(输入):

    <div class="form-group">
    <label for="DtChkIn">Data Checkin</label>
        <div class="input-group date" id="dp1">
        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
        <input type="text" class="form-control input-sm" id="DtChkIn" placeholder="Data CheckIn" readonly="readonly">
        </div>
</div>
<div class="form-group">
    <label for="DtChkOut">Data Checkout</label>
        <div class="input-group date" id="dp2">
        <span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
        <input type="text" class="form-control input-sm" id="DtChkOut" placeholder="Data CheckOut" readonly="readonly">
        </div>
</div>

和javascript:

var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

var checkin = $('#dp1').datepicker({
    language: "pt",
    format: "dd/mm/yyyy",
    beforeShowDay: function (date) {
        return date.valueOf() < now.valueOf() ? false : '';
    }
}).on('changeDate', function (ev) {
    if (ev.date.valueOf() > checkout.date.valueOf()) {
        var newDate = new Date(ev.date);
        newDate.setDate(newDate.getDate() + 1);

        checkout.setValue(newDate);
    }

    checkin.hide();
    $('#DtChkOut').focus();
}).data('datepicker');

var checkout = $('#dp2').datepicker({
    language: "pt",
    format: "dd/mm/yyyy",
    beforeShowDay: function (date) {
        return date.valueOf() <= checkin.date.valueOf() ? false : '';
    }
}).on('changeDate', function (ev) {
    checkout.hide();
}).data('datepicker');
4

1 回答 1

0

解决方案: 与 eternicode datepicker bs3 分支一起使用的脚本(签入签出)

var nowTemp = new Date();
var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);

var checkin = $('#dp1').datepicker({

    beforeShowDay: function (date) {
        return date.valueOf() >= now.valueOf();
    }
}).on('changeDate', function (ev) {
    if (ev.date.valueOf() > checkout.date.valueOf()) {
        var newDate = new Date(ev.date)
        newDate.setDate(newDate.getDate() + 1);
        checkout.setValue(newDate);
        checkout.setDate(newDate);
        checkout.update();
    }
    checkin.hide();
    $('#dp2')[0].focus();
}).data('datepicker');
var checkout = $('#dp2').datepicker({
    beforeShowDay: function (date) {
        return date.valueOf() > checkin.date.valueOf();
    }
}).on('changeDate', function (ev) {
    checkout.hide();
}).data('datepicker');

请注意在与结帐日期比较之前添加以更新签入日期的行:

   checkout.setDate(newDate);
   checkout.update();
于 2014-01-30T16:53:36.820 回答