按给定值的属性选择元素

时间:2012-07-20 16:52:37

标签: javascript jquery

我有下表。我也有这个数组谁的值对应行 [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>

5 个答案:

答案 0 :(得分:1)

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);

});​

答案 1 :(得分:1)

尝试:

<强> 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/

享受并祝你好运!

答案 2 :(得分:1)

你可以这样做,只对数组中存在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);
    }
});

答案 3 :(得分:1)

试试这个(我使用的是来自underscorejs.org的lib)

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

或没有下划线:

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/

答案 4 :(得分:1)

你可以这样做,

<强> 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);
});​