通过给定值的属性选择元素

我有下表。我也有这个数组，其值与行[52,24,12]的data-id属性相对应。对于每个数组值，表中只会存在一行。我想为数组中存在的每一行增加count列。例如，12会变为13，32会变为33，6会变为7.jQuery解决方案是首选，但是，本地JavaScript解决方案就足够了。谢谢通过给定值的属性选择元素

<table> 
<thead> 
    <tr><td>count</td></tr> 
</thead> 
<tbody> 
    <tr data-id="24"><td>32</td></tr> 
    <tr data-id="52"><td>12</td></tr> 
    <tr data-id="42"><td>4</td></tr> 
    <tr data-id="84"><td>2</td></tr> 
    <tr data-id="12"><td>6</td></tr> 
</tbody> 
</table>

来源

2012-07-20 user1032531

你可以发布你正在使用实际创建数组的代码？ – 2012-07-20 16:59:53

var myArray = $（'＃list input：checked'）; – user1032531 2012-07-20 17:02:16

这些答案的每个人都很棒！特勒的第二个答案似乎是最简单的，但是，不知道它是否最有效。无论如何，我必须选择一些东西，所以......谢谢大家！ – user1032531 2012-07-20 17:25:52

试试这个（我用的lib从underscorejs.org）

_.each([52,24,12], function (item) { 
    var td = $('tr[data-id=' + item + '] td'); 
    td.text(parseInt(td.text()) + 1); 
});

或W/O下划线：

var a = [52,24,12]; 
for (var i = 0; i < a.length; ++i) { 
    var td = $('tr[data-id=' + a[i] + '] td'); 
    td.text(parseInt(td.text()) + 1); 
}

http://jsfiddle.net/ACJ9r/

来源

2012-07-20 17:07:49

Something like this应该做的伎俩

var indices = [52, 24, 12]; 

//loop through each array entry 
jQuery.each(indices, function(i, val) { 

    var tr, value; 

    //get the tr with the corresponding data-id, cache for reuse 
    td = $('tr[data-id="' + val + '"] td'); 

    //just trying to be verbose 
    value = td.text();   //get the text 
    value = parseInt(value, 10); //parse the number off it 
    value++;      //increment 

    //put the incremented values back 
    td.text(value); 

});

来源

2012-07-20 17:00:28 Joseph

尝试：

HTML：

<table> 
<thead> 
    <tr><td>count</td></tr> 
</thead> 
<tbody> 
    <tr data-id="24"><td>32</td></tr> 
    <tr data-id="52"><td>12</td></tr> 
    <tr data-id="42"><td>4</td></tr> 
    <tr data-id="84"><td>2</td></tr> 
    <tr data-id="12"><td>6</td></tr> 
</tbody> 
</table>

jQuery的：

indices = [52, 24, 12]; 

$('tr[data-id]').each(function() { 
    if (indices.indexOf($(this).data('id')) == -1) { 
     return; 
    } 
    var td = parseInt($(this).find('td').html()); 
    $(this).find('td').html(td + 1); 
});

的jsfiddle：http://jsfiddle.net/Xc7JC/1/

享受和好运气！

来源

2012-07-20 17:01:00

这不仅适用于ID数组中的数字。这对所有具有id的行都有效。 – jfriend00 2012-07-20 17:06:07

答复已更新。 – 2012-07-20 17:10:48

你可以像这样做，只对阵列中存在ID的行进行操作。

这比使用多个jQuery调用来查找数组中的每个id的解决方案可能更有效，因为这只需要遍历一次行，而那些必须遍历表行N次。

<table id="myTable"> 
<thead> 
    <tr><td>count</td></tr> 
</thead> 
<tbody> 
    <tr data-id="24"><td>32</td></tr> 
    <tr data-id="52"><td>12</td></tr> 
    <tr data-id="42"><td>4</td></tr> 
    <tr data-id="84"><td>2</td></tr> 
    <tr data-id="12"><td>6</td></tr> 
</tbody> 
</table> 

var rowList = [52, 24, 12]; 

$("#myTable tr").each(function() { 
    var id = $(this).data("id"); 
    if (id && $.inArray(id, rowList) != -1) { 
     var cell = $(this).find("td"); 
     cell.text(parseInt(cell.text(), 10) + 1); 
    } 
});

来源

2012-07-20 17:01:19 jfriend00

似乎不起作用。 http://jsfiddle.net/BKDLZ/ – user1032531 2012-07-20 17:16:41

@ user1032531 - 修复了几个拼写错误，并更新了我的答案。现在的作品：http://jsfiddle.net/jfriend00/t2YyP/ – jfriend00 2012-07-20 17:19:24

是的，在契约中工作。哇，多好的答案！ – user1032531 2012-07-20 17:19:57

你可以不喜欢它这，

Live Demo

arr = [52,24,12]; 
$('tr').each(function(){ 
    if($.inArray($(this).data('id'), arr) > -1) 
     $(this).children('td').text(+$(this).children('td').text()+1); 
});

来源

2012-07-20 17:14:10 Adil

通过给定值的属性选择元素

回答

相关问题