从表单中获取所有表单字段并将它们保存在数组中答案

【问题标题】：Get all form fields from form and save them in array从表单中获取所有表单字段并将它们保存在数组中
【发布时间】：2018-03-12 05:25:27
【问题描述】：

在提交表单时，我想获取所有表单字段并将它们保存在一个数组中。但是文本框、选择框、输入字段、复选框和单选按钮很少。这是 WordPress 内置的动态表单，用户可以从后端更改这些字段。这是我的代码

var form_label = [];
var form_value = [];
i = 0;
jQuery('#form6 .wdform-field').each(
    function (index) {
        var form_label[i++] = jQuery(this).find(label).text();
        var form_value[i++] = jQuery(this).find(input).val();
    }
);

在每个表单字段之外都有一个div 类wdform-field，但我不知道该字段将是输入字段、复选框还是文本区域。现在，正如上面代码中提到的，它仅适用于输入字段，但不适用于其他表单字段，如文本区域或复选框。因此，在这种情况下，我如何才能正确地获取这些值及其标签形成所有表单字段。
非常感谢您的帮助。

【问题讨论】：

好的，但我的问题是关于从表单字段中获取这些值。正如我提到的，会有一些文本框、复选框、输入字段。那么我如何动态获取这些值并将它们存储在一个数组中。

标签： javascript jquery

【解决方案1】：

可能是我无法很好地解释我的问题。但是这段代码对我有用。

<script>
var form_label = new Array();
var form_value = new Array();

jQuery('#form6 .wdform-field').each(
    function(index){
    form_label.push(jQuery(this).find('label').text());
    form_value.push(jQuery(this).find(':input').val());
}
);
</script>

使用此代码，我可以从所有表单字段.find(':input') 中获取价值并且值现在也正确保存在数组中。

【讨论】：

【解决方案2】：

使用 SerializeArray()，获取数组中的表单字段

jQuery(form.event).serializeArray();

【讨论】：

【解决方案3】：

您必须在输入、按钮、复选框、单选、文本区域...等中添加属性“名称”

并使用序列化获取表单字段

更多信息https://api.jquery.com/serialize/

【讨论】：

【解决方案4】：

正如其他答案中所指出的，表单输入可以通过来自 Jquery 的 Serialize/SerializeArray 捕获。

$( "form" ).on( "submit", function( event ) {

  document.write(JSON.stringify($( this ).serializeArray()));
  event.preventDefault();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<form name="tstForm">
<input type="text" value="Jor" name="txtName" />
<input type="text" value="Dar" name="txtLastName" />
<select name="Qual">
 <option>A</option>
 <option>B</option>
 <option>C</option>
 <input type="submit" />
</select>
</form>
</div>

【讨论】：