从datepicker

Question

我想了解以下代码。有什么方法可以从日期选择器中选择日期并获得以下几周的日期而不是获得实时日期？我试图改变“var nextMonday = getNextWeekDay（new Date（），1）;” to var nextMonday = getNextWeekDay（new Date（“＃generate_date”），1）;但我可以得到它

 function getNextWeekDay(startDate, dayOfWeek) {

    var dayOffset = dayOfWeek > startDate.getDay()
        ? dayOfWeek - startDate.getDay()
        : dayOfWeek - startDate.getDay() + 7;

    startDate.setDate(startDate.getDate() + dayOffset);
		//alert("startDate>>"+startDate);

    return startDate;
}

var nextMonday = getNextWeekDay(new Date(), 1);
var nextTue = getNextWeekDay(new Date(), 2);// 0 = Sunday, 1 = Monday, ...
var nextwed = getNextWeekDay(new Date(), 3);
var nextThur = getNextWeekDay(new Date(), 4);
var nextFri = getNextWeekDay(new Date(), 12);
var nextSaturday = getNextWeekDay(new Date(), 13);
var nextSunday = getNextWeekDay(new Date(), 14);

<div class="form-group">
                        <label class="control-label"> Date</label>
                        <div class="controls">
                            <input class="form-control" type="date" name="generate_date" id="generate_date" placeholder="Generate Date" >
                        </div>
                      </div>

 function getNextWeekDay(startDate, dayOfWeek) {

    var dayOffset = dayOfWeek > startDate.getDay()
        ? dayOfWeek - startDate.getDay()
        : dayOfWeek - startDate.getDay() + 7;

    startDate.setDate(startDate.getDate() + dayOffset);
		//alert("startDate>>"+startDate);

    return startDate;
}

var nextMonday = getNextWeekDay(new Date(), 1);
alert(nextMonday);
var nextTue = getNextWeekDay(new Date(), 2);// 0 = Sunday, 1 = Monday, ...
var nextwed = getNextWeekDay(new Date(), 3);
var nextThur = getNextWeekDay(new Date(), 4);
var nextFri = getNextWeekDay(new Date(), 12);
var nextSaturday = getNextWeekDay(new Date(), 13);
var nextSunday = getNextWeekDay(new Date(), 14);

Answer 1

您必须获取任何表单元素的value，而不是元素本身。那么，你试过的那条线：

var nextMonday = getNextWeekDay(new Date("#generate_date"), 1)

将日期控件的id称为字符串，但您需要将日期元素实际引用为对象，然后从中提取value属性。该行可以调整为：

// Get the object reference:
var datePicker = document.getElementById("#generate_date");

// Then use a property from the object:
var nextMonday = getNextWeekDay(new Date(datePicker.value), 1)

但是，如果我理解正确，您只想从日期选择器中选择的日期获得偏移日期。这只是构建一个新的日期，它与原始日期偏移一个偏移量（7，我想你想要）。

var datePicker = document.getElementById("generate_date"); // Get a reference to the date control

// Set up an event handler to run every time the value in the control is adjusted
datePicker.addEventListener("input", function(){
  // Call the function that gets the new date and pass it the current date
  // from the control and an amount of days to offset that date by
  getNextDate(new Date(this.value), 7);
});

function getNextDate(startDate, offset) {
    // Create a new Date that starts with the date in the control and is adjusted by the offset:
    alert("startDate>> " + 
      new Date(startDate.getYear(), startDate.getUTCMonth(), startDate.getUTCDate() + offset));
}

<div class="form-group">
  <label class="control-label"> Date</label>
  <div class="controls">
    <input class="form-control" type="date" name="generate_date" id="generate_date">
  </div>
</div>