如何无需提交即可实现年龄计算并仅输出年龄结果？

嘿，我帮你调整好了代码，现在完全符合你的需求——不用点提交按钮，选好生日就自动计算年龄，而且只会输出你要的那种简洁结果~

修改后的完整代码 #

<label for="bday">输入生日:</label>
<input type="date" id="bday">
<div id="resultBday"></div>

<script>
// 监听日期输入框的变化，实时触发计算
document.getElementById('bday').addEventListener('input', function() {
  const Bdate = this.value;
  // 如果没选日期，清空结果
  if (!Bdate) {
    document.getElementById('resultBday').innerHTML = '';
    return;
  }
  const Bday = +new Date(Bdate);
  // 计算年龄，用~~快速取整代替Math.floor
  const age = ~~((Date.now() - Bday) / (31557600000));
  // 只输出指定格式的内容
  document.getElementById('resultBday').innerHTML = `<p>You are ${age}</p>`;
});
</script>

我主要做了这几个改动：

• 把原来的点击触发改成了实时监听输入框变化，用户选完日期立刻计算，不用点提交按钮
• 加了空值判断，没选日期的时候不会乱显示内容
• 砍掉了多余的文本输出，只保留你要的<p>You are XX</p>格式

内容的提问来源于stack exchange，提问作者Penalse