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

Question

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

ValidTo 日期应根据 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 日期选择器事件。

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 将日期自动更改为恰好 1 个月

How to automatically change Date using jQuery to exactly 1 Month

html

jquery

datetimepicker