Question

我有一个小应用程序，当选中复选框时会创建data-pref=true，并在取消选中时将其切换到data-pref=false。

要识别，该复选框还有一个data-column。

这里有一个例子： JS：

$('#dropContent [data-pref=true]')[0].data('column')

HTML：

 <div id="dropContent">
        <input data-column="id" data-pref="false" type="checkbox">id
        <br />
        <input data-column="weight" data-pref="true" type="checkbox">weight
    </div>

我需要按照点击[0][1][2]的顺序自动获取数据列值，但使用.data('column')，.attr和.prop是不可能的...

当第一个data-pref变为真时取值[0] $（'＃dropContent [data-pref = true]'）[0] 当第二个data-pref变为真时，取值[1] $（'＃dropContent [data-pref = true]'）[1] 等...

此功能保存用户选择的列的首选项，当用户选择列时（此为data-pref=true[0]），当用户取消选择列[this take data-pref=false[0]）时。当页面调整大小时，我的表格搜索data-pref=true，我需要使用data-column的值来替换用户点击的默认列...

Answer 1

使用.map().get()：

 $('#dropContent :checkbox').change(function (){
      var cols = $('#dropContent [data-pref=true]').map(function (i, el){
          return $(el).data('column');
      }).get();
      console.log(cols);
 });

.map()将遍历具有特定data-pref属性的元素复选框，而get()将获取数组中的值。

https://jsfiddle.net/gy3prrgg/2/

Answer 2

使用循环

var column =[];
$('#dropContent [data-pref=true]').each(function(i,v){
  column.push($(v).attr('data-column'));
});

https://jsfiddle.net/6usgnker/

Answer 3

如果我理解正确，你想要定位所有项目而不只是一个。

如果使用选择器$('#dropContent [data-pref=true]')，它将返回一个可以循环的数组：

$(function() {
   $('#dropContent [data-pref=true]').each( function(index) {
       var c = $(this).data('column');
       console.log( c );
   });
});

在each()内，您可以处理数据，例如将其添加到数组或将其写入元素。

Answer 4

$($('#dropContent [data-pref=true]')[nrPriority]).data('column');

问题是：.data只能使用$('')声明....

获取更多元素的数据值

4 个答案: