6

現在の行のクローンである新しい行を追加しようとしています。次のコードを試しました。エラーは発生しませんが、行も追加されません。私のコードのエラーは何ですか? 代わりの簡単なアイデアはありますか？

        $('input[name="cmdAddRow"]').live('click', function(){
            $curRow = $(this).parent('tr');
            $newRow = $curRow.clone(true);
            console.log($newRow);
            $curRow.after($newRow);
            console.log('added');
        });

HTML レイアウト:

<table>
    <tr>
        <td><input type="hidden" name="uin" value="xxx"></td>
        <td><input type="text" name="uname" value=""></td>
        <td><input type="text" name="uadd" value=""></td>
        <td><input type="text" name="utel" value=""></td>
        <td><input type="button" name="cmdAddRow" value="Add"></td>
    </tr>
</table>
4

3 に答える 3

16

$(this).parent('tr')何も見つかりません。あなたのinput要素は atdまたは a の中にありthます。parent要素の直接の親のみを検索し、それを指定したセレクターと比較します。したがって、何も見つかりません。次に、何も複製せず、古い何もないの後に新しい何も挿入しません。当然のことかもしれませんが、これは実際には何もしません。

closestセレクターに一致する最も近い要素を見つけるを使用する必要があります

var $curRow = $(this).closest('tr');

グローバル変数を使用していることにも注意してください。これは、使用していないためですvar(上記の行でこれを修正しています)。これはおそらくやりたくないでしょう。さらに、live使用するのに適した機能ではありません。代わりに使用onして、同じことをよりエレガントに行います。

$('#yourTable').on('click', 'input[name="cmdAddRow"]', function() {
    var $curRow = $(this).closest('tr'),
        $newRow = $curRow.clone(true);
    console.log($newRow);
    $curRow.after($newRow);
    console.log('added');
});
于 2012-05-29T11:15:22.643 に答える
2

このようにする代わりに、 $。 closestまたは$.parentsのいずれかを使用する必要があります$.parent

 $('input[name="cmdAddRow"]').live('click', function(){
        $curRow = $(this).closest('tr');
        $newRow = $curRow.clone(true);
        console.log($newRow);
        $curRow.after($newRow);
        console.log('added');
    });​

ワーキングフィドル

$ .liveは現在減価償却されているため、$。onの使用を検討する必要があります。

于 2012-05-29T11:16:39.070 に答える
0

onの代わりに使用するliveのliveは非推奨です。最新バージョンの jQuery、parent()selectstd要素、2 つのparent()メソッドまたはを使用するためclosest('tr')です。

 $('input[name="cmdAddRow"]').on('click', function(){
            $curRow = $(this).parent().parent();
            $newRow = $curRow.clone(true);
            console.log($newRow);
            $curRow.after($newRow);
            console.log('added');
 });

http://jsfiddle.net/qVm75/3/

于 2012-05-29T11:15:19.477 に答える