1

ajaxの更新が完了した後に単一の行を更新したいテーブルがあります。すべての行には、注文の行番号であるIDがあります。私はいろいろなことを試しましたが、喜びはありません。

これは現在のコマンドです...

wsHtml += '<tr id="idLine'+data[0].ORDS1_LINE+'">';
wsHtml += '<td class="RightNoWrap"  >' + data[0].ORDS1_LINE + '</td>';
.....
wsHtml += '</tr>';

$('#idLine'+data[0].ORDS1_LINE).fadeOut(1000,function(){ $(this).html(wsHtml).fadeIn(1000); });

ありがとう

4

3 に答える 3

4

<tr>古いものをDOMから完全に削除し、その位置に新しいものを追加することをお勧めします。これは機能するはずです：

var the_new_row = $('<tr id="idLine'+data[0].ORDS1_LINE+'">\
                         <td class="RightNoWrap"  >' + data[0].ORDS1_LINE + '</td>\
                     </tr>');

$('#idLine' + data[0].ORDS1_LINE).fadeOut(1000, function() { 
    the_new_row.insertAfter($(this)).hide();
    $(this).remove();
    the_new_row.fadeIn(1000);
});

これがjsFiddleです> http://jsfiddle.net/ckvgu/

于 2012-06-13T10:54:45.090 に答える
1

wsHtmlには、要素のinnerHTMLのみを含める必要があります。したがって、trタグを追加する必要はありません。

コードが機能する場合は、次のような結果を得ることができます。

<tr id="idLine223">
<tr id="idLine223">
<td class="RightNoWrap">223</td>
</tr>
</tr>

解決：

trタグを追加する行を削除します。

wsHtml += '<td class="RightNoWrap"  >' + data[0].ORDS1_LINE + '</td>';
.....
于 2012-06-13T10:57:57.560 に答える
0

TR行を直接アニメーション化することはできません。次の手順をお勧めします。

  1. オンザフライで行と同じスタイルの1行テーブルを作成し、アニメーション化する行の上に配置します。

  2. .contents()jQueryのメソッドを使用して行のコンテンツを取得します。

  3. 新しく作成されたテーブルにコンテンツを追加します
  4. このテーブルのコンテンツをアニメーション化して変更し、
  5. 次に、コンテンツを関連する行に再バインドし、一時テーブルを削除します。
于 2012-06-13T10:53:52.087 に答える