这是一个非常基础的HTML表单提交问题，但却是一个非常实用的技巧
我的业务场景是这样的：
一个可动态创建input的表单，如下图
这意味着input的name不能是一个固定的，要不然肯定会被覆盖掉的
第一种，传统的普通的提交方式，给每一个要提交的input一个唯一的name
<form id="form1" action="./index.php" method="get">
<div class="form-control">
<input type="text" name="name1" />
<input type="text" name="num1" />
<input type="text" name="img1" />
</div>
<br>
<div class="form-control">
<input type="text" name="name2" />
<input type="text" name="num2" />
<input type="text" name="img2" />
</div>
<br>
<div class="form-control">
<input type="text" name="name3" />
<input type="text" name="num3" />
<input type="text" name="img3" />
</div>
......
<input type="submit" value="Submit" />
</form>
浏览器提交抓到的格式是这样子的
服务器获取打印出来的是这样的，对后端的数据处理就非常不友好
第二种，数组的方式进行表单提交
<form id="form1" action="./index.php" method="get">
<div class="form-control">
<input type="text" name="infos[1][name]" />
<input type="text" name="infos[1][num]" />
<input type="text" name="infos[1][img]" />
</div>
<br>
<div class="form-control">
<input type="text" name="infos[2][name]" />
<input type="text" name="infos[2][num]" />
<input type="text" name="infos[2][img]" />
</div>
<br>
<div class="form-control">
<input type="text" name="infos[3][name]" />
<input type="text" name="infos[3][num]" />
<input type="text" name="infos[3][img]" />
</div>
......
<input type="submit" value="Submit" />
</form>
浏览器和后端打印的分别为
细心观察就回发现，提交的name值发生了变化，变成了一样的 ？数组？
提交到后端就回发现数据比之前整齐多了
但这里要注意的是，提交的数组键中不需要使用引号，要不然引号也会成为键的一部分
当然了，实际中还可能遇到这样的问题，要提交的组数（像上面的1、2、3）是不确定的，可以在前端随意的添加，这个时候怎么去用数组提交这些内容呢？
下面就是我业务中的实际解决方案
这样的话，二维数组的键则不需要我们自己去维护了，由浏览器帮我们自动生成
后端接收到的数据则变成了这样子，变得非常好处理了
此方法适用于，要提交一堆不确定个数的一组有关的数据对
完结撒花！~
新技能已get√