jquery - 使用 .serialize 生成的查询字符串中的分组值

Question

我有一个表格：

<form id="formFilter">    
    <input type="checkbox" name="type" id="type_red" value="red" ?>
    <label for="type_red">Red</label>

    <input type="checkbox" name="type" id="blue" value="Blue" ?>
<label for="type_blue">Blue</label>
</form>

然后，我使用这个 jQuery 序列化字段：

fp("#formFilter").submit(function(){
    var querystring = fp(this).serialize();
    fp('#result').html(querystring);
    return false;
});

这将返回字符串type=Red&type=Blue

除了我需要这样的字符串：type=Red,Blue

如果有人能指出我实现这一目标的正确方向，我将不胜感激。

Answer 1

更改名称以使它们自动分组，从：

<input type="checkbox" name="type" id="type_red" value="red" ?>

至

<input type="checkbox" name="type[]" id="type_red" value="red" ?>

这将在服务器端对它们进行分组。

如果出于某种奇怪的原因，您要做的只是创建一个字符串，您可以这样做：

$("#formFilter").on('submit', function(){
    var qs = $(this).serializeArray(),
        q = {},
        querystring = "?";

    $.each(qs, function(idx, arr) {
        if (q[arr.name] === undefined) q[arr.name] = [];
        q[arr.name].push(arr.value);
    });

    $.each(q, function(name, value) {
        querystring += (name + "=" + value.join(',') + "&");
    });

    querystring = querystring.substring(0, querystring.length - 1);

    $('#result').html(querystring);
    return false;
});