想要从给定年龄计算出生日期



我正在尝试计算给定年龄的出生日期。 我的逻辑是

当我们进入一个年龄时,说"5"。出生日期将从当前日期开始计算 5 年。示例当前日期为 20/8/2018。 如果年龄为 2013 年 8 月 5 日,则出生日期为 2013 年 8 月。 所以下面是我的代码:

function validatedob() {
var dob_value = document.getElementById('dob').value;
var age_value = document.getElementById('age').value;
var current_date = new Date();
var birth_date = new Date();
var birth_year = current_date.getFullYear() - age_value;
var birth_month = current_date.getMonth();
var birth_day = current_date.getDate();
birth_date.setDate(current_date.getFullYear() - age_value);
birth_date.setMonth(current_date.getMonth());
birth_date.setFullYear(current_date.getDate());
document.getElementById('dob').setDate(birth_day);
document.getElementById('dob').setMonth(birth_month);
document.getElementById('dob').setFullYear(birth_year);
}
<div class="form-inline" id="Age">
<label for="age">Age</label>
<input id="age" type="integer" name="age" onchange="validatedob()">
</div>
<div class="form-inline" id="birth">
<label for="DOB">Date of Birth</label>
<input id="dob" type="date" value="Unknown" name="date_of_birth" max="31-12-2030">
</div>

这是行不通的。我不擅长 html 属性。 有人可以帮助我吗?如何实现这一点?

这是简单的答案:

> d1 = new Date(2018, 00, 01)
Date 2018-01-01T00:00:00.000Z
> d2 = new Date(d1.getFullYear() - 5, d1.getMonth(), d1.getDate())
Date 2013-01-01T00:00:00.000Z

但是,我建议使用像Luxon这样的库。

如果你自己做,约会操纵绝对是一场噩梦。这段来自Computerphile的视频比我更好地总结了它:
https://www.youtube.com/watch?v=-5wpm-gesOY

这是一个非常简单的解决方案,可以对HTML进行一些更改。

对 HTML 的更改:

  • divlabel都有ID"age",这必须是唯一的。
  • type="integer"不存在,所以我把它改成了type="number".
  • 而且value="unknown"格式不正确"yyy-MM-dd",所以我只是删除了它。
  • for="DOB"for="dob",现在也可以

法典:

.HTML

<div class="form-inline">
<label for="age">Age</label>
<input id="age" type="number" name="age"onchange="validatedob()">
</div>
<div class="form-inline" id="birth">
<label for="dob">Date of Birth</label>
<input id="dob" type="date" name="date_of_birth" max="31-12-2030">
</div>

JavaScript

function validatedob() {
var age_value = document.getElementById("age").value;
var current_date = new Date();
var birth_date = new Date(current_date.getFullYear() - age_value, current_date.getMonth(), current_date.getDate() + 1);
document.getElementById("dob").valueAsDate = birth_date;
}

以下是一些示例代码供您参考

https://codepen.io/ji_in_coding/pen/wEvoMK

<div class="form-inline" id="Age">
<label for="age">Age</label>
<input id="age" type="integer" name="age" onchange="validatedob()">          
</div>
<div class="form-inline" id="birth" >
<label for="DOB">Date of Birth</label>
<input id="dob" type="input" name="date_of_birth">                     
</div>

爪哇语

function validatedob()
{
var age_value = document.getElementById("age").value;
var today = new Date();
var calculated_birthday = new Date(
parseInt(today.getFullYear())+parseInt(age_value), 
today.getMonth(), 
today.getDate());
document.getElementById("dob").value = calculated_birthday.toLocaleDateString("en-US");
}

你的问题是你正在尝试setDate和 cie 在HTMLElement上。输入dob需要格式为yyyy-MM-dd的字符串。你可以尝试这样的事情:

var $dob = document.getElementById('dob');
var $age = document.getElementById('age');
function validatedob() {
var age = $age.value;
var date = new Date();
date.setFullYear(date.getFullYear() - age);
$dob.value = formatDate(date);
}
function formatDate(date) {
var d = new Date(date),
month = '' + (d.getMonth() + 1),
day = '' + d.getDate(),
year = d.getFullYear();
if (month.length < 2) month = '0' + month;
if (day.length < 2) day = '0' + day;
return [year, month, day].join('-');
}
<div class="form-inline" id="Age">
<label for="age">Age</label>
<input id="age" type="integer" name="age" onchange="validatedob()">
</div>
<div class="form-inline" id="birth">
<label for="DOB">Date of Birth</label>
<input id="dob" type="date" value="Unknown" name="date_of_birth" max="31-12-2030">
</div>

PS:出于性能目的,避免在每个方法调用中重复document.getElementById(...)。按照我的例子做一次。

最新更新