使用Jquery，用新的一行替换表中的一行 [英] Using Jquery, replace one row in table with a new one

问题描述

说我有一张桌子:

<table id="mytable">
      <tr class="old_row"><td>1</td><td>2</td><td class="edit">Edit</td></tr>
      <tr class="old_row"><td>1</td><td>2</td><td class="edit">Edit</td></tr>
      <tr class="old_row"><td>1</td><td>2</td><td class="edit">Edit</td></tr>
</table>

我想点击<td>Edit</td>单元格，并使用jquery将新行替换为内容更多的新行，例如

I want to click on the <td>Edit</td> cell and use jquery to replace the entire row with a new row with more content, e.g.

    $(document).ready(function() {

        $('#mytable .edit').click( function() {

            var tr = $(this).parent();
            var new_row = '<tr class="new_row"><td>3</td><td>4</td><td>Save</td></tr>'
            // code to replace this row with the new_row
        });

    } );

有什么想法可以做到吗?

Any idea how this could be done?

推荐答案

$(document).ready(function() {

    $('#mytable .edit').click( function() {

        var new_row = '<tr class="new_row"><td>3</td><td>4</td><td>Save</td></tr>'
        $(this).parent().replaceWith(new_row);
    });

} );

这篇关于使用Jquery，用新的一行替换表中的一行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！