Question

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

        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);
            }
        });

当用户选择类似于30或类似的东西时，这并没有显示范围。然后我发现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文件，但即使这样也无法正常工作。请帮助！

Answer 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 ); }
        });   
  });

Answer 2

Datejs被放弃了，我不建议使用它。 Read here

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

例如：

var m = moment(evDateObject.getDate());
m.add('months', 1);
evDateObject.setDate(m.toDate());

如何在bootstrap datetime小部件中添加或减去日期，天，月？

2 个答案: