javascript - jQuery：将 td 元素添加到 tr

Question

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

首先，我尝试仅将 to 附加<td>到行，但效果不佳。

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

Answer 1

您没有存储最后一行。

当您调用时$(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);

见小提琴

Answer 2

而不是append使用after和使用===(or ==) 而不是=

  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.

Answer 3

使用==比较运算符进行比较：插入新单元格使用 .after() 或者您可以使用附加整行.append()

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

Answer 4

你的附加 INSIDE a td，你想要.after

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

整个，==结束=也是一个问题。

Answer 5

你在这里犯了错误：

 obj.Type='Error' 

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

检查与

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

Answer 6

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