Question

我有一个有班级的按钮。

点击它我会在表格中添加一些行。

 $('.add_line_tel').click(function(){
            $('#product-table tr:last').after('<tr class="">'
                +'<td><input type="text"  name="tel1" ></td>'
                +'<td style="text-align: center" style="width:240px" nowrap="nowrap">'
                +'<input type="radio" name="categorie[]Tel" value="1"> Téléphone&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="categorie[]Tel" value="2">   Mobile&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="categorie[]Tel" value="3"> Fax&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="categorie[]Tel" value="4"> E-mail&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'
                +'</td>'
                +'<td style="text-align: center" style="width:50px">'
                +'<input type="hidden" value="0">'
                +'<a data-tooltip="Supprimer la ligne" data-placement="left"><img src="images/remove.png" class="remove_line_tel"></a>'
                +'</td>'
                +'</tr>')
        })

然后我需要有可能删除行，如果有太多。

我做了类似的事情：

$('.remove_line_tel').click(function(){
            $(this).closest("tr").remove(); 
        })

但除了加载页面时存在的行外，它不起作用。

我想这是dom的内容（准备与否？）但我不知道我错在哪里。

任何帮助将不胜感激。

Answer 1

使用事件委托：

    $(document).on('click', '.remove_line_tel', function(){
        $(this).closest("tr").remove(); 
    });

<强>更新

查看此页面，了解如何在早期版本的jQuery中执行此操作：jQuery.live() API Documentation

这应该适用于1.6：

    $('.remove_line_tel').live('click', function(){
        $(this).closest("tr").remove(); 
    });

或者：

    $(document).delegate('.remove_line_tel', 'click', function(){
        $(this).closest("tr").remove(); 
    });

删除动态创建的动态行

1 个答案: