Question

我在添加和删除表单表中的字段时遇到了一些麻烦。它是一个简单的代码，因为我对此有点新鲜。

    <table id="lisa_pakkumine_tabel">
        <tr>
            <td>Vali hange: <?php getlisthange();?></td>
            <td><button class="add_field_button">Lisa rida</button></td>
        </tr>

        <tr>
            <th>Vali pakkuja</th>
            <th>Sisesta maksumus</th>
        </tr>

        <tr>
            <td><?php getlistpakkuja();?></td>
            <td><input type='text' name='pakkumuse_maksumus[]'/><a href="#"class="remove_field">Eemalda rida</a></td>
        </tr>
    </table><br>
    <input type="submit" value="LISA PAKKUMINE">


jQuery(document).ready(function() {
    $('button.add_field_button').click(function(){
        $('table#lisa_pakkumine_tabel tr:last').clone().appendTo('table#lisa_pakkumine_tabel');
        return false;
    });
});

jQuery(document).ready(function() {
    $('.remove_field').click(function(){
        $(this).parent().parent().remove();
    });
});

这个想法是克隆一个包含php函数的字段行（从mysql填充选择列表），因为你不能使用克隆从jquery im调用php。添加行有效，但在尝试删除它时，它只删除第一行而不对其他行执行任何操作。所以基本上它只删除了原来的行。

编辑：

Answer 1

试试这个：

jQuery(document).ready(function() {
    $('.remove_field').click(function(){
        $(this).closest('tr').remove();
    });
});

Answer 2

由于您要动态添加行，因此您分配的处理程序仅分配给您挂钩时存在的行。你想要做的是通过事件委托处理点击，根据表格

jQuery(function($) {
    $("#lisa_pakkumine_tabel").on("click", ".remove_field", function() {
        $(this).closest('tr').remove();
    });
});

它挂钩了表上的click事件，但是告诉jQuery只有在点击时通过.remove_field元素到达表的路径时才触发我们的处理程序。

jQuery remove（）仅删除第一行

2 个答案: