根据数据属性获取每个复选框集的值答案

【问题标题】：Getting values of each checkbox set based on data attribute根据数据属性获取每个复选框集的值
【发布时间】：2019-12-07 12:42:18
【问题描述】：

我正在尝试使用 jQuery 根据 data 属性获取单独的检查值列表。

以下是我的脚本，根据原始问题编辑

jQuery(document).on("click", ".refno", function () {
   var refindex = jQuery(this).data("refindex");
   //alert(refindex);
   jQuery('.datarefindex_'+ refindex ).each(function(){
        alert(refindex);//do your stuff here
   });
});

每个refindex 下都有数量不定的复选框列表。所以我认为需要each 函数。以下是我试图捕获的数据样本。这些数据将通过 ajax 请求与其他一些数据一起发送以进行处理。

假设此场景中有 3 组复选框。

var list1 = array/list of checked items from list 1;
var list2 = array/list of checked items from list 2;
var list3 = array/list of checked items from list 3;

但是当我尝试上述方法时，所有复选框都被选中（每个列表有 20 个复选框），其中有 data-mainrefindex=refindex。但我只想得到上面提到的3个变量。

感谢任何支持。我希望我把我的问题说清楚了。

【问题讨论】：

标签： javascript jquery each

【解决方案1】：

我无法从屏幕截图中确定复选框的情况，但您可以检查 jQuery("input[name=list1]:checked") 是否选中了所有复选框以及您的复选框是否真的全部选中（如果问题是选择器或复选框状态）。

尝试在你的代码中查看活动项目是否有一个类来区分它和非活动，也许你可以通过使用一个类来选择它，如果没有一个活动类你可以在 onClick 处理程序中设置它：

jQuery(this).addClass('.activeClass');

以及使用此选择器的循环槽项目：

`jQuery("input[name=list1].activeClass")`

【讨论】：

【解决方案2】：

您可以创建一个包含数组的对象并将其传递给 Ajax。见下文。我所做的只是将项目添加到数组中。如果您想在未选中时从 Array 中删除该项目，请告诉我。

<div data-refindex='1'>
<input type="checkbox" value='1'/> 1
<input type="checkbox" value='2'/> 2
<input type="checkbox" value='3'/> 3
<input type="checkbox" value='4'/> 4
<input type="checkbox" value='5'/> 5
</div>
<div data-refindex='2'>
<input type="checkbox" value='6'/> 6
<input type="checkbox" value='7'/> 7
<input type="checkbox" value='8'/> 8
<input type="checkbox" value='9'/> 9
<input type="checkbox" value='10'/> 10
</div>

Javascript（需要 jQuery）

var arraysObj = {};
$("div input").on('click',function(e){
  var arrayId = $(e.target).parent('div').data('refindex');
  if(typeof arraysObj['group_'+arrayId] === 'undefined')
    arraysObj['group_'+arrayId] = [];
  if ($(e.target).is(':checked') && $.inArray($(e.target).val(),arraysObj['group_'+arrayId]) === -1)
    arraysObj['group_'+arrayId].push($(e.target).val())
    console.log( JSON.stringify(arraysObj) );
})

JsFiddle Link

【讨论】：