1

私は Web の専門家ではありませんが、JQuery を使用した適切な方法について支援が必要です。

私の問題: アイテムの大きなテーブルがあります。各項目にはページの他のセクションに追加するためのボタンがあるため、コンテンツを抽出して新しい要素に設定する必要があります。

私はこのコードを JSFiddleで書きましたが、これが正しい解決方法であるかどうかはわかりません (ただし、機能します)。

私が念頭に置いている他のオプションは、コピーしたい行の番号を持つ ID を持ち、テキストを処理して、たとえば $('name-'+id) で値を取得することです。これは次のようになります。

<tr id='row-1'>
    <td id='name-1' class='name'>First</td>
    <td id='lastname-1' class='lastname'>Brand</td>
    <td>
        <button id='btnTest-1' class='btnTest'>Add</button>
    </td>
</tr>

コメントやアドバイスありがとうございます！

4

3 に答える 3

1

クリック ハンドラーを変更して、イベント委任とon()メソッドを使用するようにして、DOM に追加された新しい要素をリッスンし続けるようにします。

obj.on("click", '.delName', function (e) {
        e.preventDefault();
        $(this).parent().remove();
});

http://jsfiddle.net/Wk4Ut/2/

objを参照するだけで、イベントは.delnameのクリックをリッスンし、親にバブル アップします。children().children() を使用する必要はありません

于 2013-10-25T15:23:40.513 に答える
1

増分idまたはclass属性を使用しないでください。メンテナンスの悪夢に変わります。

連鎖したand呼び出しの代わりにclosest()andを使用することで、取得したコードを改善できます。また、動的に追加されたボタンに委任されたイベントを使用することもできます。これを試して：find()parent()children()

$(document).ready(function () {
    $('.btnTest').click(function (e) {
        e.preventDefault();
        var $tr = $(this).closest('tr');
        var name = $tr.find('.name').text();
        var lastname = $tr.find('.lastname').text();
        $('#names').append('<div><span>' + name + ' ' + lastname + '</span><button class="delName">Delete name</button></div>');
    });

    $('#names').on('click', '.delName', function (e) {
        e.preventDefault();
        $(this).closest('div').remove();
    });
});

フィドルの例

于 2013-10-25T15:19:25.457 に答える