表单中input name属性有无[]的区别
Form提交有个小技巧,应用中灵活使用可以起到事半功倍的效果。
这个技巧就是input数组提交。
1input数组
如下一个表单:
<inputtype="text"name="username[]"value="Jason"/> <inputtype="text"name="username[]"value="Tom"/> <inputtype="text"name="username[]"value="Goe"/>
我们在name属性值后面加一个中括号[],后台获取数据的时候,就能拿到一个数组:$_POST['username']=['Jason','Tom','Goe']。
改用GET方式再提交,可以看到数据格式是这样的:
username%5B%5D=Jason&username%5B%5D=Tom&username%5B%5D=Goe
其中,%5B%5D就是中括号[],代表数组。
2非input数组
另一种容易混淆的提交方式,就是name后面没有中括号[]:
<inputtype="text"name="username"value="Jason"/> <inputtype="text"name="username"value="Tom"/> <inputtype="text"name="username"value="Goe"/>
这种情况提交后,后台拿不到一个数组,而是最后那个标签的值,也就是$_POST['username']='Goe'。
GET方式提交看到数据格式如下:
username=Jason&username=Tom&username=Goe
这种方式三个username后面没有带[]。
3非input数组方式提交成数组
上面两种提交方式中,直接点提交按钮提交,和用jQuery$('form').seriaze()序列化提交,得到的结果都是一样的。
加[]后台得到数组,不加[]得到最后标签的值。
如果第二种也要提交成数组,那怎么办呢?
办法就是,在提交之前用jQuery处理:
$('form').on('submit',function(e){ e.preventDefault(); vardata=$("input[name='username']").map(function(){ return$(this).val(); }).get(); $.post('save.php',{username:data},function(r){ $('p').html(r); }); });
这种方式稍显啰嗦。
如果不需要提交之前不需处理数据,直接用第一种方式最为方便。