jQuery将选中的复选框的值存入数组

问题描述：

我试图获取当前选中的所有复选框的值并将它们存储到数组中。这是我的代码到目前为止：jQuery将选中的复选框的值存入数组

$("#merge_button").click(function(event){ 
    event.preventDefault(); 
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){ 
     return $(this).val(); 
    }); 
    console.log(searchIDs); 
    });

但是，这种产出超过我的需要。我不仅获得了价值观，还获得了一些我不想要的东西。

[ “51729b62c9f2673e4c000004”， “517299e7c9f26782a7000003”， “51729975c9f267f3b5000002”，prevObject：jQuery.fn.jQuery.init [3]，上下文：文档，jquery的： “1.9.1”，构造：功能，初始化：函数...]

我想只是ID的（在这种情况下的前3项）。

通过使用$.each和推值到一个数组我得到所需的输出：

$("#find-table input:checkbox:checked").each(function(){ myArray.push($(this).val()); })

[ “51729b62c9f2673e4c000004”， “517299e7c9f26782a7000003”， “51729975c9f267f3b5000002”]

但是我d喜欢使用$.map，因为它为我节省了一行代码并且更漂亮。

感谢

答

呼叫.get()把所产生的jQuery对象成为真正的阵列。

$("#merge_button").click(function(event){ 
    event.preventDefault(); 
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){ 
     return $(this).val(); 
    }).get(); // <---- 
    console.log(searchIDs); 
});

每the documentation：

由于返回值是一个jQuery对象，其中包含一个数组，这是很常见的调用获得（）的结果与基本阵列工作。

我期待从'$ .map'真正的数组。感谢解决方案，它的工作原理。 – 2013-04-23 15:16:54

非常感谢你，我需要这个ma Ticketcenter – Steven 2013-06-21 17:50:22

我没有得到这件事的事情是为什么'.get（）'是需要的，当函数返回'.val（）'从每个项目jQuery集合。这是因为'map'在将它传递给'searchIDs'之前将它变回jQuery对象？ – iconoclast 2013-10-16 15:17:45

答

您需要添加.toArray()您.map()函数结束

$("#merge_button").click(function(event){ 
    event.preventDefault(); 
    var searchIDs = $("#find-table input:checkbox:checked").map(function(){ 
     return $(this).val(); 
    }).toArray(); 
    console.log(searchIDs); 
});

演示：在最后http://jsfiddle.net/sZQtL/

答

我重构了你的代码，并相信我提供了你正在寻找的解决方案。基本上不是将searchIDs设置为.map()的结果，而是将值推入数组中。

$("#merge_button").click(function(event){ 
    event.preventDefault(); 

    var searchIDs = []; 

    $("#find-table input:checkbox:checked").map(function(){ 
    searchIDs.push($(this).val()); 
    }); 

    console.log(searchIDs); 
});

我创建了一个运行代码的fiddle。

这基本上是OP在他/她的问题中的正确结果...... – 2013-04-23 13:54:33

答

DEMO：http://jsfiddle.net/PBhHK/

$(document).ready(function(){ 

    var searchIDs = $('input:checked').map(function(){ 

     return $(this).val(); 

    }); 
    console.log(searchIDs.get()); 

});

只需调用get（）方法，你就会有你的阵列，因为它是写在规格：http://api.jquery.com/map/

$(':checkbox').map(function() { 
     return this.id; 
    }).get().join();

答

不要使用 “每个”。它用于相同元素的操作和更改。使用“map”从元素体中提取数据并在其他地方使用它。

会很好，有这样的示例代码 – 2017-10-18 21:19:47

jQuery文档对大多数所有内容都有很好的示例，包括'map' – jinglesthula 2017-11-21 16:23:44

答

需要将HTML中作为数组命名的表单元素作为javascript对象中的数组，就好像表单实际上已提交一样。

如果有多个复选框如窗体：

<input name='breath[0]' type='checkbox' value='presence0'/> 
<input name='breath[1]' type='checkbox' value='presence1'/> 
<input name='breath[2]' type='checkbox' value='presence2'/> 
<input name='serenity' type='text' value='Is within the breath.'/> 
...

结果是与对象：

data = { 
    'breath':['presence0','presence1','presence2'], 
    'serenity':'Is within the breath.' 
} 


var $form = $(this), 
    data = {}; 

$form.find("input").map(function() 
{ 
    var $el = $(this), 
     name = $el.attr("name"); 

    if (/radio|checkbox/i.test($el.attr('type')) && !$el.prop('checked'))return; 

    if(name.indexOf('[') > -1) 
    { 
     var name_ar = name.split(']').join('').split('['), 
      name = name_ar[0], 
      index = name_ar[1]; 

     data[name] = data[name] || []; 
     data[name][index] = $el.val(); 
    } 
    else data[name] = $el.val(); 
});

而且还有吨答案在这里这有助于提高我的代码，但他们要么太复杂，要么完全没有做我想要的：Convert form data to JavaScript object with jQuery

工作，但可以改进：只适用于一维数组和re暗疮指数可能不是连续的。数组的length属性返回下一个索引号作为数组的长度，而不是实际的长度。

希望这有助于。合十！

答

 var ids = []; 

$('input[id="find-table"]:checked').each(function() { 
    ids.push(this.value); 
});

这一个为我工作！

jQuery将选中的复选框的值存入数组

相关推荐