jQuery:将td元素添加到tr

时间:2013-10-31 15:03:51

标签: javascript jquery html

使用row变量动态获取数据并设置表格行。

var row = '<tr>'+
      '<td>'+obj.Message+'</td>'+
      '<td>'+obj.Error+'</td>'+
      '<td>'+obj.Detail+'</td>'+
      '</tr>';

基于一个值,我尝试将另一个<td>添加到行对象,但它不起作用。

if(obj.Type=='Error') {
  $(row).find('td:last').append('<td>'+ obj.ErrorCode+'</td>');
}
$('table> tbody:last').append(row);

首先,我尝试将<td>附加到行但是效果不佳。

$(row).append('<td>'+ obj.ErrorCode+'</td>');

6 个答案:

答案 0 :(得分:6)

你没有存储最后一行。

当您致电$(row).find(...).append(...)时,结果未存储在变量中。最好的解决方案可能是从一开始就保留一个jQuery对象:

//         v--- use a jQuery object here
var $row = $('<tr>'+
      '<td>'+obj.Message+'</td>'+
      '<td>'+obj.Error+'</td>'+
      '<td>'+obj.Detail+'</td>'+
      '</tr>');    
if(obj.Type=='Error') {
    $row.append('<td>'+ obj.ErrorCode+'</td>');
}
$('table> tbody:last').append($row);

请参阅fiddle

答案 1 :(得分:3)

而不是append使用after并使用===(或==)代替=

  if(obj.Type === 'Error') {
    $(row).find('td:last').after('<td>'+ obj.ErrorCode+'</td>'); //This will add the new td after the last one
   ..

或只是将其附加到行:

   $(row).append('<td>'+ obj.ErrorCode +'</td>'); //this will do the same thing, less code and append this as last td of your row.

答案 2 :(得分:0)

使用==比较运算符进行比较: 要插入新单元格,请使用.after(),或者只需使用.append()

附加整行
if(obj.Type=='Error') {
   $(row).append('<td>'+ obj.ErrorCode+'</td>');
}

答案 3 :(得分:0)

您希望td追加.afterif(obj.Type=='Error') { $(row).find('td:last').after('<td>'+ obj.ErrorCode+'</td>'); }

==

整体而言,=超过{{1}}也是一个问题。

答案 4 :(得分:0)

你在这里犯了错误:

 obj.Type='Error' 

(=)在这里充当赋值运算符。

检查

  if(obj.Type=='Error'){
   //hence code.
  }

答案 5 :(得分:0)

您是否必须先将row添加到DOM中,然后才能搜索并添加另一个<td>

解决方案1 ​​

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>';

if(obj.Type=='Error') {
    row += '<td>'+ obj.ErrorCode+'</td>';
}

row += '</tr>';

$('table> tbody:last').append(row);

解决方案2

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>'+
          '</tr>';

$('table').append(row);

if(obj.Type=='Error') {
    $('table').find('td:last').after('<td>'+ obj.ErrorCode+'</td>');
}

解决方案3

var row = '<tr>'+
          '<td>'+obj.Message+'</td>'+
          '<td>'+obj.Error+'</td>'+
          '<td>'+obj.Detail+'</td>'+
          '</tr>';

$('table').append(row);

if(obj.Type=='Error') {
    $('table tr').append('<td>'+ obj.ErrorCode+'</td>');
}