使用JavaScript获取数组中表单的所有控件

Getting all controls of a form in an array using JavaScript?

本文关键字：控件 表单 JavaScript 获取 数组 使用      更新时间：2023-09-26

如何使用JavaScript获取所有控件及其值和所选状态？最好有一个数组，其中包含数组中的所有控件（如select和radio）及其选定状态。

这有可能吗？

谢谢！

form.elements集合中提供了表单的所有控件。然后，您可以对集合进行迭代，并根据需要对其进行处理。

例如

function processForm(form) {
  var control, controls = form.elements;
  for (var i = 0, iLen = controls.length; i < iLen; i++) {
    control = controls[i];
    // Do something with the control
    console.log(control.tagName + ':' + control.name + ' - ' + control.value);
  }
}
<form id="form0">
<fieldset><legend>The form</legend>
  <input name="inp0" value="foo"><br>
  <select name="sel0">
    <option value="opt0" selected>opt0
    <option value="opt1">opt1
    <option value="opt2">opt2
  </select><br>
  <input type="button" value="Process form" name="btn0" onclick="
       processForm(this.form);
      ">
  <input type="reset">
</fieldset>
</form>
<input name="outsideForm" form="form0" value="Over the fence">

如果进行

myParentNode.querySelectorAll('input[type="checkbox"], input[type="radio"]');

您将获得一个HTML元素数组，这些元素是<input>，type为checkbox或radio。然后，您可以使用.value 访问它们的值

相关文章：