将HTML表单输入转换为Javascript变量并比较值

debugcn 发表于 Dev

朱Chu

我正在尝试比较两个人的出生日期。第1个人和第2个人以HTML格式输入其姓名和出生日期，我想使用Javascript比较这两个日期，并在HTML页面上打印出哪个人年龄较大。但是，我不确定如何提交表格并比较日期。到目前为止，这是我对HTML的了解：

<form id="form1">
  Full name of first person: <input type="text" name="name1"><br>
  Birthday: <input type="date" date="date1"><br>
  <br>
  Full name of second person: <input type="text" name="name2"><br>
  Birthday: <input type="date" date="date2"><br>
</form>

和Javascript：

 var name1 = document.getElementsByName("name1");
 var name2 = document.getElementsByName("name2");
 var date1 = document.getElementsByName("date1");
 var date2 = document.getElementsByName("date2");

如何在HTML中提交变量，然后让Javascript比较两个日期？

Praveen Kumar Purushothaman

您忘记了两件事：

提交按钮。
提交处理程序。

我想这解决了您的问题。

window.onload = function () {
  document.getElementById("form1").onsubmit = function () {
    var name1 = document.getElementById("name1");
    var name2 = document.getElementById("name2");
    var date1 = document.getElementById("date1");
    var date2 = document.getElementById("date2");
    if ((new Date(date1.value)).getTime() < (new Date(date2.value)).getTime()){
      console.log(name1.value + " is greater than " + name2.value)}
    else if ((new Date(date1.value)).getTime() > (new Date(date2.value)).getTime()){
      console.log(name2.value + " is greater than " + name1.value)}
    else{
      console.log(name2.value + " and " + name1.value + " are of same age.")};
  };
};

<form id="form1">
  Full name of first person: <input type="text" id="name1"><br>
  Birthday: <input type="date" id="date1"><br>
  <br>
  Full name of second person: <input type="text" id="name2"><br>
  Birthday: <input type="date" id="date2"><br>
  <input type="submit" value="Check" />
</form>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。