Question

我正在尝试为 dynatable 生成的<td>添加一个类名，但我不知道如何。我试过这个，但是不起作用：

<table id="my-final-table">
  <thead>
    <th>Band</th>
    <th>Song</th>
      <th style="display:none;" class="td-id">id</th>
  </thead>
  <tbody>
  </tbody>
</table>

我想将td-id添加到最后<td>。

var jsondata=[
  {
    "band": "Weezer",
    "song": "El Scorcho",
      "id":1
  },
  {
    "band": "Chevelle",
    "song": "Family System",
      "id":2
  }
];

var processingComplete = function(){
    $('#my-final-table tr').on("click",function(){
        console.log($(this));
});
};
$('#my-final-table').dynatable({
  dataset: {
    records: jsondata
  }
}).bind('dynatable:afterProcess', processingComplete);

processingComplete();

但是当我点击一行时，行html就像这样：

<td style="text-align: center;">Chevelle</td>
<td style="text-align: center;">Family System</td>
<td style="display: none;text-align: start;">2</td>

JSFiddle：http://jsfiddle.net/maysamsh/pDVvx/5/

Answer 1

你可以这样做 -

$('tr').each(function(){
    $(this).find('td').eq(1).addClass('yellow');
})

http://jsfiddle.net/jayblanchard/pDVvx/6/

Answer 2

在dynatable（jquery.dynatable.js）的脚本文件中，您可以更改下面显示的脚本部分：

function defaultCellWriter(column, record) {
    var html = column.attributeWriter(record),
        td = '<td';
    if (column.hidden || column.textAlign) {
      td += ' style="';
      // keep cells for hidden column headers hidden
      if (column.hidden) {
        td += 'display: none;';
      }
==> comment the followed lines
      // keep cells aligned as their column headers are aligned
      //if (column.textAlign) {
      //  td += 'text-align: ' + column.textAlign + ';';
      //}
      td += '"';
    }
==> now the text will not be aligned when the table is generated!
    return td + '>' + html + '</td>';
  };

将css类添加到可动态列

2 个答案: