2

我有以下 jQuery 代码（x 为 3，i 为 1，storeid 为 4）：

function addNewTableRow(x,i,storeid){
    $('#kds_resultsTable tbody').append('<tr></tr>'); //tr:nth-child('+(i)+')'
    for (var a=1; a<=x; a++) {
        if(a==1){
            $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+"'></td>"));
        }else{
            $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+" kds_elementstoreid_"+storeid+"></td>"));
        }
    }
}

但是，如果 x 确实是 3（表明 else 的情况应该被打印两次），那么 HTML 输出是这样的（以单个表格行为例）：

<tr>
    <td class="5 kds_elementsstoreid_4"></td>
</tr>

似乎 .append 覆盖了之前在 for 循环中附加的文本，只剩下循环最后一次迭代中生成的 HTML。我本来希望有 3 个<td></td>元素，而不仅仅是一个。

在这里使用正确.append()的 jQuery 函数，还是应该使用其他不会覆盖我以前的内容的东西？我不确定在不使用.append().

作为参考，我使用的是 jQuery 的最新可用版本（截至 2013 年 15 月 3 日）。

4

4 回答 4

1

回答你的问题：是的，.append()是正确的调用函数。它不应该覆盖以前附加的<td>元素。

我看不出你的代码有什么问题。看起来“i”参数应该与新附加行的编号匹配，以便tr:nth-child(i)引用该行。

我建议重写此函数以避免使用tr:nth-child(i).

您可以尝试以下方法：

function addNewTableRow(x, i, storeid) {
    var $row = $('<tr></tr>');
    for (var a = 1; a <= x; a++) {
        var $cell = $('<td class="' + i + '"></td>');
        if (a > 1) {
            $cell.addClass('kds_elementstoreid_'+ storeid);
        }
        $row.append($cell);
    }
    $('#kds_resultsTable').find('tbody').append($row);
}

注意：我不认为调用 to$.parseHTML()是必要的，但它们不是问题。

于 2013-03-17T23:39:45.417 回答
1

在这里，您忘记了 else 语句中的最后一个单引号。改变这个

else{
            $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+" kds_elementstoreid_"+storeid+"></td>"));
        }

对此

else{
            $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+" kds_elementstoreid_"+storeid+"'></td>"));
        }

http://jsfiddle.net/Eru5M/7/

于 2013-03-17T23:51:09.410 回答
0

不要使用追加，而是尝试使用 .after();

$('#kds_resultsTable tbody').after('<tr></tr>'); //tr:nth-child('+(i)+')'
for (var a=1; a<=x; a++) {
    if(a==1){
        $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td     class='"+i+"'></td>"));
    }else{
        $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+" kds_elementstoreid_"+storeid+"></td>"));
    }
}
于 2013-03-17T23:32:45.300 回答
0

如果你传递 i = 1，它会一直在寻找第一个元素吗？

尝试将其更改为：

$('#kds_resultsTable tbody tr:nth-child('+(a)+')')

还 

        $('#kds_resultsTable tbody tr:nth-child('+(i)+')').append($.parseHTML("<td class='"+i+" kds_elementstoreid_"+storeid+"></td>"));

看起来它缺少一个结束撇号。

于 2013-03-17T23:45:37.413 回答