Question

如何在日期选择器的特定日期设置if为条件？
例如，当用户在日期选择器中插入特定的日期时，会出现一条消息，并报告是否存在事件。

function myFunction() {
  var x, text;
  // Get the value of input field with id="test"
  x = document.getElementById("test").value;
  if (x == "07/21/2019") {
    text = "Birthday event";
  } else {
    text = "No events";
  }
  document.getElementById("demo").innerHTML = text;
}

<p>make if conditional for a specific day in datepicker</p> <input id="test" type="date"> <button type="button" onclick="myFunction()">Submit</button>
<p id="demo"></p>

Answer 1

日期值的格式为：

yyyy-mm-dd

请参见<input type="date">：

要注意的一件事是，显示的日期格式与实际值不同–显示的日期格式将根据用户浏览器的设置区域设置来选择，而日期值始终采用yyyy-mm-dd格式

function myFunction() {
  var x, text;
  // Get the value of input field with id="test"
  x = document.getElementById("test").value;
  console.log(x);
  if (x == "2017-07-21") {
    text = "Birthday event";
  } else {
    text = "No events";
  }
  document.getElementById("demo").innerHTML = text;
}

<p>make if conditional for a specific day in datepicker</p>
<input id="test" type="date" value="2017-07-21">
<button type="button" onclick="myFunction()">Submit</button>
<p id="demo"></p>

另请参阅Date and time formats used in HTML 。

Answer 2

为此，您需要从日期选择器中检索选定的日期以及具有事件的日期数组。然后，您必须对它们进行比较。

这是显示日期选择器的HTML代码。

Select a day : <input type="date" id="selectedDate">
<button onclick="checkEventDate()"> Check Events</button>

这是JavaScript函数

function checkEventDate() {
    //Get the date selected from the Date Picker and convert it to a Date Object
    var selectedDate = new Date(document.getElementById("selectedDate").value);

    //Convert the Date Object to a DateSrting.
    var isSelectedDate = selectedDate.toDateString();

    // Let's assume you have an array of dates which have events 
    var eventDates = ["2019-07-07", "2019-07-08", "2019-07-09"];

    for (var i = 0; i < eventDates.length; i++) {
        //Convert each value in the dates array to a Date Object
        eventDate = new Date(eventDates[i])

        //Convert every Date Object to a DateString type
        iseventDate = eventDate.toDateString();

        //Now compare if the selected date is a event date
        if (iseventDate == isSelectedDate) {
            alert("There is an event on the selected date.");
        }
    }
}

如何编写日期输入值的条件语句？

2 个答案: