我有一個日期輸入：
<input id="datetime" type="date" step="1">
<p id="status"></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.2/moment.min.js"></script>
如果 RestrictedDate 陣列中存在所選日期，我希望訊息顯示“無效日期”。現在我被困在 (< '14/10/2022')
var datetimeElement = document.getElementById("datetime");
var statusElement = document.getElementById("status");
var RestrictedDate = ["20/10/2022", "21/10/2022", "22/10/2022", "23/10/2022", "24/10/2022"];
// A simple function to check the validity of a date using the isValid() method
function checkValidity()
{
if (moment(datetimeElement.value.toString()).isValid())
{
// Datetime exist in RestrictedDate
if (moment(datetimeElement.value.toString()).format('DD/MM/YYYY') < '14/10/2022') //NEED HELP HERE
{
// Invalid date
statusElement.innerHTML = 'Invalid date';
} else {
// Datetime is valid
statusElement.innerHTML = 'Valid date';
}
} else {
// Datetime is invalid
statusElement.innerHTML = 'Please select date.';
}
}
// Check date validity every 1 seconds and update the text
setInterval(function() {
checkValidity();
}, 1000);
你可以在這里看到代碼
uj5u.com熱心網友回復：
您可以使用原型includes的方法。Array
function checkValidity() {
if (moment(datetimeElement.value.toString()).isValid()) {
const formatedDate = moment(datetimeElement.value.toString()).format('DD/MM/YYYY');
if (RestrictedDate.includes(formatedDate)) {
// Invalid date
statusElement.innerHTML = 'Invalid date';
} else {
// Datetime is valid
statusElement.innerHTML = 'Valid date';
}
} else {
// Datetime is invalid
statusElement.innerHTML = 'Please select date.';
}
}
uj5u.com熱心網友回復：
您可以檢查日期值是否存在于陣列中，這應該可以解決問題moment.js
var datetimeElement = document.getElementById("datetime");
var statusElement = document.getElementById("status");
var RestrictedDate = ["20/10/2022", "21/10/2022", "22/10/2022", "23/10/2022", "24/10/2022"];
function getFormattedDate(date) {
// this function is pulled from this answer at https://stackoverflow.com/a/15764763/11307127
let year = date.getFullYear();
let month = (1 date.getMonth()).toString().padStart(2, '0');
let day = date.getDate().toString().padStart(2, '0');
return day '/' month '/' year;
}
datetimeElement.addEventListener('change', function() {
const date = getFormattedDate(new Date(this.value));
if(RestrictedDate.includes(date))
{
statusElement.innerText = "Invalid Date";
}
else
{
statusElement.innerText = "Valid Date";
}
})<input id="datetime" type="date" step="1">
<p id="status">Please select a date</p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.2/moment.min.js"></script>uj5u.com熱心網友回復：
為什么將受限日期存盤為字串。為什么不將受限日期存盤為實際的 Date 物件，然后在您的驗證 fn 中您可以執行以下操作：
const isRestricted = RestrictedDate.find(x => x.getTime() === new Date(dateTimeElement.value).getTime());
此外，如果可能的話，我會在原生日期物件旁邊使用date- fns 之類的東西，而不是 Moment.js，它速度慢、難以除錯，現在是一個遺留專案。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/514892.html
下一篇：存盤有關類屬性的資訊