Question

我有以下功能：

function addPhone()
    {
        var value=  $('#Membership_c_tel').val();

        $.ajax({
            url: '/cabinet/membership/addPhone',
            type: 'POST',
            cache: false,
            data: {'val':value},
            beforeSend: function() {
            },
            success: function (r) {
                var val=document.getElementById("Membership_c_tel").value;
                $("#newly_create_tel").append("<li class="+val+">"+document.getElementById("Membership_c_tel").value+"<a href='#' class=''>x</a></li>");
                $('#Membership_c_tel').val('');


            },
            error: function (e) {
                console.log(e);
            }
        });

    }

当用户使用id = Membership_c_tel的inputbox提交数据时，该函数负责将<li>添加到<ul id="newly_create_tel ">。与<a href="#">x</a>同时添加了<li>。问题是当x按下时我不知道如何删除特定的<li>元素。我怎样才能实现呢？帮助我。

$('#newly_create_tel li a').click(function(event){
                    event.preventDefault();

                });

Answer 1

您需要使用event delegation，因为它是动态生成的，并使用parent()或closest()方法获取li。

$('#newly_create_tel').on('click', 'li a', function(event){
   event.preventDefault();
   $(this).parent().remove();
});

Answer 2

内部点击功能写$（this）.parent（）。remove; 它对我有用

Answer 3

尝试创建li元素并在此之后立即分配点击功能：

var $element = $('</li>).append($('#Membership_c_tel').val());
$element.append('<a/>', {href:'#', text:'x'});
$element.click(function(){
    // closests will be best if you plan to change your html inside li
    $(this).closests('li').remove();
    return false;
});
$element.appendTo($("#newly_create_tel"));

你有更多的控制权，当你真的不需要它们时你不会使用任何事件

如何删除li元素

3 个答案: