Question

我有一个包含日期字段和其他空div的表单：

<input type="date" name="b_day" id="b_day" />
<div id="age"></div>

我希望在访问者填写字段age之后看起来像“10.5 yo”计算从今天起数月内的差异，而不刷新页面

Answer 1

您可以使用JavaScript，使用其Date对象。我可能最终得到这样的东西：

HTML：

<input type="date" name="b_day" id="b_day" onchange="calculateAge()" />
<div id="age"></div>

JavaScript的：

function calculateAge() {
  var b_day = new Date(document.getElementById('b_day').value);
  var today = new Date();
  var age = (today.getFullYear() - b_day.getFullYear()) + (((today.getMonth() + 1) - (b_day.getMonth() + 1)) / 12);

  document.getElementById('age').innerHTML = age;
}

请注意，在JavaScript的日期中，月份从0到11，因此增加了一个。

更改字段后的年份差异并更新div

1 个答案: