javascript - Jquery 在数组内创建数组

Question

我有两组复选框，如下所示:

<ul id="searchFilter">
    <li class="">
        <input type="checkbox" name="location[]" class="cb_location" value="1">Toronto</li>
    <li class="">
        <input type="checkbox" name="location[]" class="cb_location" value="3">New York</li>
    <li class="">
        <input type="checkbox" name="location[]" class="cb_location" value="6">London</li>
    <li class="">
        <input type="checkbox" name="location[]" class="cb_location" value="5">Paris</li>
    <li class="">
        <input type="checkbox" name="location[]" class="cb_location" value="4">Berlin</li>
</ul>

        <ul id="searchFilter">
                    <li><input type="checkbox" name="price[]" class="cb_price" value="2"> $200,000 to $299,999</li>
                    <li><input type="checkbox" name="price[]" class="cb_price" value="3"> $300,000 to $399,999</li>
                    <li><input type="checkbox" name="price[]" class="cb_price" value="4"> $400,000 to $499,999</li>
                    <li><input type="checkbox" name="price[]" class="cb_price" value="5"> $500,000+</li>
                </ul>

我有这个 jquery 代码，它获取所选内容的值并将其放入 opts 数组中:

$(':checkbox').change(function() {
   var opts = $(":checkbox:checked").map(function() {
        return $(this).val();
    }).get(); 
    console.log(opts);
});

但这将返回选中的复选框值的值，无论它们位于哪组复选框中，我的问题是如何将它们分开，但在 opts 数组中，我正在寻找这些结果:

[位置[1,2,3]，价格[1,2,3]]

这是一个 fiddle :http://jsfiddle.net/6zz5f/1/

Answer 1

要创建这样的复杂对象，您需要显式构建它:

$(':checkbox').change(function () {
    var opts = {};
    $(":checkbox:checked").each(function () {
        var name = this.name;
        if (!opts[name]) opts[name] = [];
        opts[name].push(this.value);
    });
    console.log(opts);
});

http://jsfiddle.net/mblase75/Ttv3y/

结果将类似于:

{ location[]: [1,2,3], price[]: [4,5,6] }

如果需要，您可以从循环内的复选框名称中删除 []:

var name = this.name.substring(0,this.name.length-2);