Question

<form id="file-upload">
  <input type="text" name="title[]" placeholder="Title">
  <input type="text" name="alt[]" placeholder="Alt">
  <input type="text" name="keywords[]" placeholder="Keywords">

  <input type="text" name="title[]" placeholder="Title">
  <input type="text" name="alt[]" placeholder="Alt">
  <input type="text" name="keywords[]" placeholder="Keywords">
  //etc
</form>

我的表单中有许多具有相同名称的字段。

我希望在JS中运行表单，获取标题，关键字和alt值并将它们附加到我的表单数据对象，然后我将我的图像添加到formData对象并保存图像及其元数据服务器端

我的问题是获取表单输入值。最好是将表格封装起来，还是仅仅循环通过dom元素？我怎么能这样做？

所以我需要：

获取第一个标题，alt，关键字字段 - 如何？
附加到formData，并将文件发送到服务器 - 我可以这样做。
获取第二个标题，alt，关键字字段 - 如何？
附加到formData，并将文件发送到服务器 - 我可以这样做。

依旧......

Answer 1

document.getElementsByName("title[]");返回所有匹配元素的数组。然后按索引获取第一个，第二个等。

document.getElementsByName("title[]")[0];    // first title

https://developer.mozilla.org/en-US/docs/Web/API/document.getElementsByName

在jQuery中，这很好用：

var firstTitle = $("[name='title[]']")[0].value;

虽然你一定要缓存选择器：

var titles = $("[name='title[]']");
var firstTitle = titles[0].value;
var secondTitle = titles[1].value;

Answer 2

我做了一些挖掘并创造了这个小提琴。希望它有所帮助。

var values = $("input[name='title\\[\\]']").map(function(){return $(this).val();}).get();

$("<div>title[0]:"+values[0]+"</div>").appendTo('#results');
$("<div>title[1]:"+values[1]+"</div>").appendTo('#results');
$("<div>title[2]:"+values[2]+"</div>").appendTo('#results');

http://jsfiddle.net/y5n8A/

Answer 3

http://api.jquery.com/jquery.map/

尝试使用（map）函数，这是制作数组的最佳方法

获取具有相同名称的表单输入

3 个答案: