添加CSS到jQuery数据表中的特定单元格

Question

我在我的项目中使用jQuery和数据表。

我现在想要的是CSS添加到细胞上的按钮，点击即改变细胞color.I只想改变单一的特定单元格的值不是整行

我尝试以下方法，它没有工作

<table id="food"> 
    <thead> 
     <tr> 
      <th>Number</th> 
      <th>Name</th> 
      <th>Type</th>       
     </tr>       
    </thead>  
    <tbody> 
     <tr> 
      <td>1</td> 
      <td>Apple</td> 
      <td>Fruit</td> 
     </tr> 
     <tr> 
      <td>2</td> 
      <td>Mango</td> 
      <td>Fruit</td> 
     </tr> 
     <tr> 
      <td>3</td> 
      <td>Grape</td> 
      <td>Fruit</td> 
     </tr> 
    </tbody> 
</table> 

<button id='button1'>Click me</button> 

这里是jQuery的

$('#button1').click(function(){ 

    //Here I want to change row 1,col 3 to red color 

    var cell = table.row(1).column(3).node(); 
    $(cell).addClass('change-color'); 

}); 

感谢

Answer 1

你可以做这样的事情来获得在第3栏和单元格和行2（零索引）

var nodes = myTable.column(2).nodes(); 
$(nodes[1]).addClass('change-color); 

这里是一个演示http://jsfiddle.net/dhirajbodicherla/189Lp6u6/19/

Answer 2

您还可以更改所有值界定具有一列增量I +数字

这项工作与jQuery数据表

var myTable = $('#example2').DataTable(); 
var columnas = new Array(); 
    columnas[4] = 4; 
$.each(columnas, function(i, v) { 
    var x = i+3; 
    var nodes = myTable.column([x]).nodes(); 
    var y = i+3; 
    $.each(nodes, function(y, v) { 
     $(nodes[y]).addClass('change-color');    
    }); 
});