0

私はこのコードを実行しています:

$('#storeTable').empty();

$('#storeTable').append("<tr>");
$('#storeTable').append("<td>");
$('#storeTable').append(returnData["1"]["ID"]);
$('#storeTable').append("</td>");
$('#storeTable').append("</tr>");

ただし、1ページの読み込みで複数回実行すると、「storeTable」要素は実行するたびに高くなります。私は明らかな何かを見逃していますか、これはjQuery / JavaScriptの落とし穴ですか、それは私のブラウザ(Chrome)のせいですか、それとも私は何か間違ったことをしていますか?

コードは明らかに改良が必要です。私はページの動的セクションの最低限の実装を取得しようとしています。

その他の詳細が必要な場合は、コメントなしで単に反対票を投じるのではなく、質問してください。

もちろん、storeTableもテーブルです。

4

2 に答える 2

1

.append()HTMLの一部を追加するために使用することはできません。。append()形成されたオブジェクト全体のみを追加し、それらを追加すると、ターゲットオブジェクトの最後の子として追加します。

これに加えて、一部のブラウザは、テーブル内のコンテンツを作成/削除する方法を選択しています。

#storeTableタグであると仮定すると、まったく新しいテーブルを一度に作成するよう<table>に割り当てることができます。.html()

$("#storeTable").html("<tr><td>" + returnData["1"]["ID"] + "</td></tr>");

作業デモ: http: //jsfiddle.net/jfriend00/5BVdX/

于 2012-08-10T20:07:32.007 に答える
1
$('#storeTable').empty();

// Will create three rows, one after another
$('#storeTable').append("<tr><td>123</td></tr>");
$('#storeTable').append("<tr><td>456</td></tr>");
$('#storeTable').append("<tr><td>789</td></tr>");

// Will create three rows, each next replaces previous
$('#storeTable').html("<tr><td>123</td></tr>");
$('#storeTable').html("<tr><td>456</td></tr>");
$('#storeTable').html("<tr><td>789</td></tr>");
于 2012-08-10T20:13:12.457 に答える