表单中input name属性有无[ ]的区别

野性酷女 2023-08-17 17:07 64阅读 0赞

## 转载：[https://www.cnblogs.com/qq254980080/p/9608774.html][https_www.cnblogs.com_qq254980080_p_9608774.html] ##

## 1 input数组 ##

如下一个表单：

我们在`name`属性值后面加一个中括号`[]`，**后台获取数据的时候，就能拿到一个数组**：`$_POST['username'] = ['Jason', 'Tom', 'Goe']`。

改用GET方式再提交，可以看到数据格式是这样的：

username%5B%5D=Jason&username%5B%5D=Tom&username%5B%5D=Goe

其中，`%5B%5D`就是中括号`[]`，代表数组。

## 2 非input数组 ##

另一种容易混淆的提交方式，就是name后面没有中括号`[]`：

这种情况提交后，后台拿不到一个数组，而是最后那个标签的值，也就是`$_POST['username'] = 'Goe'`。

GET方式提交看到数据格式如下：

username=Jason&username=Tom&username=Goe

这种方式三个`username`后面没有带`[]`。

## 3 非input数组方式提交成数组 ##

上面两种提交方式中，直接点提交按钮提交，和用jQuery`$('form').serializ()`序列化提交，得到的结果都是一样的。

加`[]`后台得到数组，不加`[]`得到最后标签的值。

如果第二种也要提交成数组，那怎么办呢？

办法就是，在提交之前用jQuery处理：

$('form').on('submit',function(e) {
        e.preventDefault();
    
        var data = $("input[name='username']").map(function () {
         return $(this).val();
         }).get();
    
        $.post('save.php', {username: data}, function(r){
            $('p').html(r);
        });
    });

[https_www.cnblogs.com_qq254980080_p_9608774.html]: https://www.cnblogs.com/qq254980080/p/9608774.html