form中相同name的checkbox提交问题

最新推荐文章于 2019-02-13 18:49:00 发布

原创最新推荐文章于 2019-02-13 18:49:00 发布 · 594 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#HTML

javascript 专栏收录该内容

29 篇文章

订阅专栏

本文介绍了一种使用jQuery改进表单序列化的方法，通过自定义serializeObject函数，实现了将复选框等表单元素的值以逗号分隔的形式进行序列化，方便后台接收处理。

比如:Form中有如下的HTML片段:

Favorite Food:<br/>
Steak:<input type="checkbox" name="food" value="Steak"/><br/>
Pizza:<input type="checkbox" name="food" value="Pizza"/><br/>
Chicken:<input type="checkbox" name="food" value="Chicken"/><br/>

通过jq函数$.param得到的是food=Steak&food=Pizza&food=Chicken,可是我想得到形如food=Steak,Pizza,Chicken又该怎么处理呢？查了下API,可以借助jq的serializeArray函数

$.fn.serializeObject = function() {
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name]) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
           }
          o[this.name].push(this.value || '');
          o[this.name] = o[this.name].join(",");
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

用数组join，避免拼接字符串问题