0

次の質問があります。

以下の例のようなテーブルがあります。計画は行をコピーすることですが、新しいクラスではありません。クラスは削除クラスで変更する必要があります。jsfiddle の例: http://jsfiddle.net/klaas3/wgRYR/目標は、最後の行を常に緑に保ち、他の行を赤に保つことです。

<table class="test">
<thead>
    <tr>
        <td>header 1</td>
        <td>header 2</td>
        <td>header 3</td>
        <td>header 4</td>
    </tr>
</thead>
<tbody>
    <tr class="1">
        <td>data 1</td>
        <td>data 2</td>
        <td>data 3</td>
        <td class="remove"></td>
    </tr>
    <tr class="2">
        <td>data 1</td>
        <td>data 2</td>
        <td>data 3</td>
        <td class="remove"></td>
    </tr>
    <tr class="new">
        <td>data 1</td>
        <td>data 2</td>
        <td>data 3</td>
        <td class="new"></td>
    </tr>
</tbody>

最後の列 (新しいクラスと削除クラス、または赤と緑の色) をボタンとして使用します。

私はすでに次のものを持っていますが、何かがうまくいかないようです:

$("table.test tr.new:last td.new").click(function(){
$('table.test tr.new:last  td.new').removeClass('new').addClass('remove').fadeIn("fast");
$('table.test tr.new:last').clone(true).insertAfter('table.test tr.new:last');
});

私は経験豊富な jquery ユーザーではありません。また、セル クラスが変更されると、テーブルの行クラスも db id で変更されます。(しかし、実際のサンプルで試してみます)。

4

1 に答える 1

1

編集:

クラスを変更する前に要素を複製する必要があります

また、クリックイベントハンドラーをオフ/削除するには、.off()を使用します。

$("table.test tr.new:last td.new").click(function(){
    var x = $('table.test tr.new:last').clone(true);
    // you can use "this" instead of $('table.test tr.new:last  td.new') since you are inside it's event handler
    $(this).removeClass('new').addClass('remove').off('click');// <-- removes handler from current td 
    x.insertAfter('table.test tr.new:last');
});​

http://jsfiddle.net/XvDBC/

于 2012-11-29T22:23:08.580 に答える