英文:
javascript focus event is not focusing first time its focus at the second time
问题
我面临JavaScript事件焦点和失焦的问题，我试图在输入字段文本上运行一个脚本，该字段具有来自jqeuryUi的日期下拉菜单。我试图应用一个条件，即如果用户选择今天的日期，那么我必须运行该脚本，否则不运行该脚本。
https://camelia.ae/checkout/
这是网站的链接，请尝试将某些内容添加到购物车中。
<script>
document.addEventListener("DOMContentLoaded", function() {
var deliveryDateInput = document.getElementById("delivery_date");
deliveryDateInput.addEventListener("focus", function() {
// 移除先前的失焦事件监听器，如果有的话
this.removeEventListener("blur", handleDateBlur);
// 添加失焦事件监听器
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("你好！你选择了今天的日期。");
}
}
});
</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
以下是代码的翻译部分：
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>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论