Question

我需要触发动态创建的元素，然后使用事件描述来获取事件并删除动态元素。

<div class="row">
    <div class="col-md-8 clickable"></div>
    <div class="col-md-4 display-clicks">
        <ul class="clicks">
        </ul>
    </div>
</div>

所以我们假设我们在display-clicks div中有上面的html，ul附加了一个在可点击div中点击的坐标列表，并在每个删除按钮旁边。可点击的div用动态创建的跨度填充，所有跨度都具有唯一的Id，这只是点击的连接坐标。我可以使用以下方法删除包含坐标和按钮的附加li：

 $('.display-clicks').on('click','button',function(){
        // and this gets me the id of the dynamic span to be removed
        // from the clickable div
        var id = $(this).data('span-id');

        // this wont work
        $(id+'_span').remove();

        // neither will this
        $(id+'_span').trigger('myEvent');

        $(this).parent().remove();
        console.log(id);
  })

myEvent看起来像这样

   $('.clickable').on('myEvent', 'span', function(event){
       $(this).remove();
    })

有什么想法吗？

Answer 1

$(this).parent().remove();也会移除this元素，因为您要移除它的父级。因此无法定义id，您无法选择范围。将该行放在块的末尾。此外，您的ID不能以数字开头 - http://www.w3schools.com/tags/att_global_id.asp

Answer 2

试试这个：

   $('.clickable').on('myEvent', 'span', function(event){
       $(this).remove();
    })

你的功能是这样的：

  $('.display-clicks').on('click','ul',function(){
        $(this).parent().remove();
        // and this gets me the id of the dynamic span to be removed
        // from the clickable div
        var id = $(this).data('span-id');

        // this works now
        $("#" + id+'_span_just_remove').remove();

        // this works too
        $("#" + id +'_span_trigger').trigger('myEvent');
  })

Plunker：https://plnkr.co/edit/ocZv95B3wBifX5zK7ob4?p=preview

向动态创建的元素添加自定义触发器

2 个答案: