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 ケースを正確に 2 回出力する必要があることを示します)、HTML 出力は次のようになります (例として 1 つのテーブル行)。

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

.append は、以前に for ループに追加されたテキストを上書きし、ループの最後の反復で生成された HTML だけを残しているようです。<td></td>1つだけでなく、3つの要素を期待していました。

ここで使用する適切な jQuery 関数は.append()ありますか、それとも以前のコンテンツを上書きしない他の何かを使用する必要がありますか? を使用せずにここでやりたいことを達成する別の方法がわかりません.append()。

参考までに、利用可能な最新バージョンの jQuery を使用しています (2013 年 3 月 15 日現在)。

4

4 に答える 4

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 に答える
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);
}

注: への呼び出しは必要ないと思いますが$.parseHTML()、問題ではありません。

于 2013-03-17T23:39:45.417 に答える
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 に答える
0

append を使用する代わりに、.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 に答える