英文:

javascript focus event is not focusing first time its focus at the second time

问题 {#heading}

我面临JavaScript事件焦点和失焦的问题，我试图在输入字段文本上运行一个脚本，该字段具有来自jqeuryUi的日期下拉菜单。我试图应用一个条件，即如果用户选择今天的日期，那么我必须运行该脚本，否则不运行该脚本。

https://camelia.ae/checkout/
这是网站的链接，请尝试将某些内容添加到购物车中。

<script>
    document.addEventListener("DOMContentLoaded", function() {
      var deliveryDateInput = document.getElementById("delivery_date");
  deliveryDateInput.addEventListener(&quot;focus&quot;, function() {
    // 移除先前的失焦事件监听器，如果有的话
    this.removeEventListener(&quot;blur&quot;, handleDateBlur);
// 添加失焦事件监听器
this.addEventListener(&amp;quot;blur&amp;quot;, handleDateBlur);

});
function handleDateBlur() {
var selectedDateParts = this.value.split(&quot;/&quot;);
var selectedDate = new Date(selectedDateParts[2], selectedDateParts[1] - 1, selectedDateParts[0]);
var today = new Date();
today.setHours(0, 0, 0, 0);
if (selectedDate.getTime() === today.getTime()) {
  alert(&amp;quot;你好！你选择了今天的日期。&amp;quot;);
}

}
});

</script>

我编写了这段代码，我试图在今天的日期上显示警报。我面临的问题是，这段代码工作，但第一次选择时不显示任何内容，但第二次选择时会显示警报。有人可以告诉我解决方法吗？ 英文:

i am facing a problem in javascript event focus and blur i am trying to run a script in a if else condition on a input field text which has a date drop down coming from jqeuryUi i am trying to apply a condition in which if the the user select the today date then i have to run the script otherwise dont run the script
https://camelia.ae/checkout/
here is the link of the website try to add something in the cart

<script>
    document.addEventListener("DOMContentLoaded", function() {
      var deliveryDateInput = document.getElementById("delivery_date");
  deliveryDateInput.addEventListener("focus", function() {
    // Remove the previous blur event listener, if any
    this.removeEventListener("blur", handleDateBlur);
// Attach the blur event listener
this.addEventListener("blur", handleDateBlur);

});
function handleDateBlur() {
var selectedDateParts = this.value.split("/");
var selectedDate = new Date(selectedDateParts[2], selectedDateParts[1] - 1, selectedDateParts[0]);
var today = new Date();
today.setHours(0, 0, 0, 0);
if (selectedDate.getTime() === today.getTime()) {
  alert("Hello! You've selected today's date.");
}

}
});

</script>

i have written this code in which i am trying to show the alert on the today date the problem i am facing is that this code is working but on the second time whe i select first time its shows nothing but when i click second time its show alert
can anyone tell me the solution of this

<script>
    document.addEventListener("DOMContentLoaded", function() {
      var deliveryDateInput = document.getElementById("delivery_date");
  deliveryDateInput.addEventListener("focus", function() {
    // Remove the previous blur event listener, if any
    this.removeEventListener("blur", handleDateBlur);
// Attach the blur event listener
this.addEventListener("blur", handleDateBlur);

});
function handleDateBlur() {
var selectedDateParts = this.value.split("/");
var selectedDate = new Date(selectedDateParts[2], selectedDateParts[1] - 1, selectedDateParts[0]);
var today = new Date();
today.setHours(0, 0, 0, 0);
if (selectedDate.getTime() === today.getTime()) {
  alert("Hello! You've selected today's date.");
}

}
});

</script>

i have written this code in which i am trying to show the alert on the today date the problem i am facing is that this code is working but on the second time whe i select first time its shows nothing but when i click second time its show alert
can anyone tell me the solution of this

答案1 {#1}

得分: 1

以下是代码的翻译部分：

let date = document.querySelector('#delivery_date');
date.addEventListener('change', onDateChange)
function getFormattedDate() {
const today = new Date();
const year = today.getFullYear();
const month = (today.getMonth() + 1).toString().padStart(2, '0'); // 月份是从零开始计数的
const day = today.getDate().toString().padStart(2, '0');
return `${year}-${month}-${day}`;

}
const formattedDate  = getFormattedDate()
function onDateChange(e) {
let selectedDate = e.target.value;
if(selectedDate === formattedDate) {
alert("你好！你选择了今天的日期。");
}
}

注意：在代码中，我将变量formatedDate改为了formattedDate以修正拼写错误。 英文:

<script>
   let date = document.querySelector('#delivery_date');
date.addEventListener('change', onDateChange)
function getFormattedDate() {
const today = new Date();
const year = today.getFullYear();
const month = (today.getMonth() + 1).toString().padStart(2, '0'); // Months are zero-based
const day = today.getDate().toString().padStart(2, '0');
    return `${year}-${month}-${day}`;
}
const formatedDate  = getFormattedDate()
function onDateChange(e) {
let selectedDate = e.target.value;
if(selectedDate === formatedDate) {
alert("Hello! You've selected today's date.");
}

} </script>