0

我在我的模板中使用了 Bootstrap DateTime 小部件，我并排放置了 2 个小部件（从、到）以根据需要选择特定范围的日期、小时或月份。我已经链接了两个小部件，因此用户可以始终选择小于“From”的“To”范围。为此，我通过以下数字添加或减去日期：

        var evDate = ev.date;
        if (evDate != null) {
            $('.'+reportCategoryTo.id).
                        datetimepicker('setStartDate', evDate);
            var evDateObject = new Date(evDate.valueOf());
            var reportDateTimeCategoryFrom = report_date_time_category[0][0];
            var reportDateTimeCategoryTo = report_date_time_category[1][0];
            if (reportDateTimeCategoryFrom.category.indexOf("Daily") !== -1) {
                var newDate = evDateObject.setDate(evDateObject.getDate() + 31);
            }
            else if (reportDateTimeCategoryFrom.category.indexOf("Monthly") !== -1) {
                var newDate = evDateObject.setDate(evDateObject.getDate() + 365);
            }
            else {
                var newDate = evDateObject.setDate(evDateObject.getHours() + 24);
            }

            var newDateObject = new Date(newDate);
            $('.'+reportCategoryTo.id).
                        datetimepicker('setEndDate', newDateObject);
            }
        else {
            console.log('The change is null',evDate);
            $('.'+reportCategoryTo.id).
                            datetimepicker('setStartDate', null);
            $('.'+reportCategoryTo.id).
                            datetimepicker('setEndDate', null);
            }
        });

当用户选择像 30th of May 或类似的东西时，这不会显示范围。然后我发现Datejs它有助于添加或减去日期等。我像这样使用 Datejs：

            if (reportDateTimeCategoryFrom.category.indexOf("Daily") !== -1) {
                var newDate = evDateObject.setDate(evDateObject.getDate().add(31).days());
            }
            else if (reportDateTimeCategoryFrom.category.indexOf("Monthly") !== -1) {
                var newDate = evDateObject.setDate(evDateObject.getDate().add(365));
            }
            else {
                var newDate = evDateObject.setDate(evDateObject.getHours().addHours(24));

但是我的控制台提示这个错误：

TypeError: evDateObject.getDate(...).add is not a function

我已经导入了date.js文件，但即便如此这也不起作用。请帮忙！

4

2 回答 2

1

实际上你不需要太担心你想要实现的功能，如果你可以使用 jQuery UI 就很简单了。使用下面的示例，jQuery 库将满足您的需求

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css">
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>

<form id="process_form" class="form" action="process.php" method="POST">
<label for="DOA">From:</label>
<input type="text" id="txtDOA" name="txtDOA" required="" class="hasDatepicker">
<label for="DOD">To:</label>
<input type="text" id="txtDOD" name="txtDOD" required="" class="hasDatepicker">
</form>

$(function()
  { 
        $("#txtDOA").datepicker({
          defaultDate: "+1w",
          changeMonth: true,
          numberOfMonths: 1,
          onClose: function( selectedDate ) { $( "#txtDOD" ).datepicker( "option", "minDate", selectedDate ); }
        });
        $("#txtDOD").datepicker({
          defaultDate: "+1w",
          changeMonth: true,
          numberOfMonths: 1,
          onClose: function( selectedDate ) { $("#txtDOA").datepicker( "option", "maxDate", selectedDate ); }
        });   
  });
于 2013-06-15T08:17:38.813 回答
1

Datejs 已被废弃，我不建议使用它。 在这里阅读。

您可能需要考虑Moment.js，它还具有日期时间算术功能。

例如：

var m = moment(evDateObject.getDate());
m.add('months', 1);
evDateObject.setDate(m.toDate());
于 2013-07-13T03:37:22.810 回答