js table加表单验证

为了实现表单验证，我们可以在提交表单时检查表单中的输入是否符合要求。以下是一个简单的例子，展示如何使用 JavaScript 和 HTML 表格来验证表单中的输入：

HTML 代码：

<form id="myForm" onsubmit="return validateForm()">
  <table>
    <tr>
      <td><label for="name">Name:</label></td>
      <td><input type="text" id="name" name="name"></td>
    </tr>
    <tr>
      <td><label for="email">Email:</label></td>
      <td><input type="email" id="email" name="email"></td>
    </tr>
    <tr>
      <td><label for="age">Age:</label></td>
      <td><input type="number" id="age" name="age"></td>
    </tr>
    <tr>
      <td colspan="2"><input type="submit" value="Submit"></td>
    </tr>
  </table>
</form>

JavaScript 代码：

function validateForm() {
  var name = document.forms["myForm"]["name"].value;
  var email = document.forms["myForm"]["email"].value;
  var age = document.forms["myForm"]["age"].value;

  if (name == "") {
    alert("Name must be filled out");
    return false;
  }
  if (email == "") {
    alert("Email must be filled out");
    return false;
  }
  if (age == "" || isNaN(age)) {
    alert("Age must be filled out with a number");
    return false;
  }
  return true;
}

这个例子中，我们使用了 `document.forms` 对象来获取表单中输入的值，然后检查这些值是否符合要求。如果某个输入框没有填写或者填写了错误的值，我们会弹出一个警告框并返回 `false`，阻止表单提交。如果所有输入框都符合要求，我们返回 `true`，允许表单提交。