[英]I'm unable to find a previous date by inputing a given date by a user using html and javascript. Can you please help me out
'This is the HTML Code' '这是 HTML 代码'
<form>
<div class="input-field">
<label>Choose Date</label>
<input type="date" id="date" onchange="myDate();" required>
</div>
<div class="input-fields">
<label>Previous Date</label>
<input type="date" id="previous" readonly>
</div>
</form>
'This is the Javascript Code' '这是 Javascript 代码'
<script>
function myDate()
{
const currDate = document.getElementById("date");
const date = new Date(currDate)
if (typeof date === 'object' && date !== null && 'getDate' in date) {
console.log("The data type is", typeof date)
console.log(date.getDate())}
else {
console.log("Invalid Date Object")
}
date.setDate(date.getDate()-1);
const previous = document.write(date);
document.getElementById("previous").value = previous;
}
</script>
I'm trying to get previous date by using the myDate Function in Javascript and i was getting an error getDate is not a function then i tried to make getDate as function and now its showing the same error.我正在尝试通过在 Javascript 中使用 myDate 函数来获取上一个日期,但我收到错误 getDate is not a function 然后我尝试将 getDate 作为函数,现在它显示相同的错误。 I'm not able to make a getDate as function or getting previous date value我无法将 getDate 作为函数或获取以前的日期值
Here is the solution for you.这是适合您的解决方案。
First problem that you had is that you got the element in currDate
instead of the value.您遇到的第一个问题是您在currDate
中获得了元素而不是值。
After that, I don't understand what you were trying to do on your previous
variable but you where overwriting the actual DOM
with the updated date.在那之后,我不明白你试图对你previous
的变量做什么,但是你用更新的日期覆盖了实际的DOM
。
Last, you have to convert the date that you want to set on the other field to the accepted string, so you need to truncate the toISOString()
method to return the date in format of YYYY-MM-DD
(since that is how you read if from the initial input).最后,您必须将要在另一个字段上设置的日期转换为接受的字符串,因此您需要截断toISOString()
方法以返回格式为YYYY-MM-DD
的日期(因为这就是您如果从初始输入中读取)。
function myDate()
{
const currDate = document.getElementById("date").value;
const date = new Date(currDate)
if (typeof date === 'object' && date !== null && 'getDate' in date) {
console.log("The data type is", typeof date)
console.log(date.getDate())}
else {
console.log("Invalid Date Object")
}
date.setDate(date.getDate()-1);
document.getElementById("previous").value = date.toISOString().split('T')[0];
}
the problem is with new Date(currDate)
this here you create new date with element
so you need to do new Date(currDate.value)
then you need to format date according to what date picker accept yyyy-MM-DD
.问题在于new Date(currDate)
在这里您使用element
创建新日期,因此您需要执行new Date(currDate.value)
然后您需要根据日期选择器接受的日期来格式化日期yyyy-MM-DD
。
function myDate() { const currDate = document.getElementById("date"); const date = new Date(currDate.value) if (typeof date === 'object' && date !== null && 'getDate' in date) { console.log("The data type is", typeof date) console.log(date.getDate()) } else { console.log("Invalid Date Object") } date.setDate(date.getDate() - 1); document.getElementById("previous").value = formateDate(date); } function formateDate(d) { return d.getFullYear() + '-' + ("0" + (d.getMonth() + 1)).slice(-2) + '-' + ("0" + d.getDate()).slice(-2) ; }
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> </style> </head> <body> <form> <div class="input-field"> <label>Choose Date</label> <input type="date" id="date" onchange="myDate();" required> </div> <div class="input-fields"> <label>Previous Date</label> <input type="date" id="previous"> </div> </form> </body> </html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.