Question

我正在使用 jQuery 在我的网页上获取日期，效果很好。我的要求是，如果用户选择 ValidFrom 日期为 01/01/2019 （2018年1月1日），或者为此选择任意随机日期，则 ValidTo 日期应自动增加 1个月。

有效期日期应根据 ValidFrom 日期更改。

以下是我的相同代码：

<script src="~/Scripts/jquery.datetimepicker.js"></script>
<script>
    $(document).ready(function () {
        $('#ValidFrom').datetimepicker({
            datepicker: true,
            timepicker: false,
            format: 'm/d/Y',
            step: 30,
            minDate: new Date()
        });
        $('#ValidTo').datetimepicker({
            datepicker: true,
            timepicker: false,
            format: 'm/d/Y',

            step: 30,
            minDate: new Date()
        });
    });

</script>

Answer 1

仅供参考，此示例使用datepicker插件（采取相应措施）。
您可以使用onSelect jQuery-UI datepicker事件。

var config = config || {};


config.datepicker_defaults = {
  format: 'm/d/Y',
  minDate: new Date(),
};


jQuery(function($) {

  var $from = $('#ValidFrom'),
    $to = $('#ValidTo');

  $from.datepicker($.extend(config.datepicker_defaults, {
    onSelect: function() {
      var dateTo = new Date($(this).datepicker('getDate'));
      dateTo.setMonth(dateTo.getMonth() + 1);

      $to.datepicker('option', 'minDate', $(this).datepicker('getDate'));
      $to.datepicker('setDate', dateTo);
    }
  }));

  $to.datepicker(config.datepicker_defaults);

});

<link href="https://code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<input type="text" id="ValidFrom" readonly>
<input type="text" id="ValidTo" readonly>

Answer 2

这就是代码的样子。

<script>
$(document).ready(function () {
    $('#ValidFrom').datetimepicker({
        datepicker: true,
        timepicker: false,
        format: 'm/d/Y',
        step: 30,
        minDate: new Date(),
        onChangeDateTime: function (dp, $input) {
            var date = new Date($input.val());
            date.setMonth(date.getMonth() + 1);
            date = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
            $('#ValidTo').val(date);
        },

    });
    $('#ValidTo').datetimepicker({
        datepicker: true,
        timepicker: false,
        format: 'm/d/Y',
        step: 30,
        minDate: new Date()
    });
});

如何使用jQuery自动将Date更改为恰好1个月

2 个答案: