Question

<script>
$(document).ready(function(){
    var i = <?=$iMaxId?>;
    var c = 0;
    $('#addphone').click(function(){
        i += 1;
        c += 1;
        var sTag = "<div class='trow' id='Phone"+i+"'><div>Phone No. </div><div><input type='text' name='sPhone[]' ><input type='button' value='delete' class='delete' id='"+i+"'></div></div>";
        $('#imgfield').last().before(sTag);
    });


    $(".delete").click(function()
    {
        var iId = $(this).attr("id");;
        $("#Phone" + iId).remove( );
    });
});
</script>

此脚本可以完美地添加输入字段，但在单击删除按钮时无法删除它们。

Answer 1

更新您的删除功能，如

$("body").on("click",".delete", function()
    {
        var iId = $(this).attr("id");;
        $("#Phone" + iId).remove( );
    });

Answer 2

$(".delete").click(function() {
    var iId = $(this).attr("id");;
    $("#Phone" + iId).remove( );
});

此代码段会立即运行。 $(".delete")选择器选择文档中当前存在的所有元素，类名为“delete”，并为这些元素设置单击事件侦听器。但是，带有“delete”类的动态添加按钮将不具有此侦听器，因为它们之前未被选中，因为它们以前不存在。

让它工作的一种方法是将设置点击侦听器的代码放在#addphone点击回调函数中，即

$(document).ready(function(){
    var i = <?=$iMaxId?>;
    var c = 0;
    $('#addphone').click(function(){
        i += 1;
        c += 1;
        var sTag = "<div class='trow' id='Phone"+i+"'><div>Phone No. </div><div><input type='text' name='sPhone[]' ><input type='button' value='delete' class='delete' id='delete"+i+"'></div></div>";
        $('#imgfield').last().before(sTag);

        $("#delete" + i).click(function() {
            var i = $(this).attr("id").replace("delete", "");
            $("#Phone" + i).remove();
        });
    });

});

顺便说一句，你不应该使用纯数字作为ID。它不允许在HTML4中使用。有些浏览器可能会抱怨。

Answer 3

这可能适合你

$(document).on('click','.delete',function(){
    $(this).parents('.trow').remove();
})

jQuery中的remove（）函数有问题

3 个答案: