Javascript 使用.prepend（）后jQuery.remove（）不起作用

我只是尝试创建一个函数，允许我使用jQuery.prepend添加一个包含内容的div，然后当单击该div时，使用.remove将其删除

Prepend似乎工作正常，但我在获取.remove以处理Prepend Div时遇到问题。它在已经存在的div上运行良好

有人能帮我解决我的问题吗

这是我的密码：

<script language="javascript" type="text/javascript">
$(document).ready(function(){
    $(".DivAdd").click(function(){
        var thisDivItem = $(this).attr('add');thisDivItemid = "DivItem"+$(this).attr('add');
        $( ".DivItem" ).parent().prepend( "<div id='"+thisDivItemid+"' class='DivRemove')>"+thisDivItem+"</div> " );
    });
    $(".DivRemove").click(function(){ $( this ).remove() });
});
</script>

<div class="DivAdd" add="321">Div Add</div>
<div class="DivItems">
    <div class="DivItem DivRemove" id="DivItem1">1</div>
    <div class="DivItem DivRemove" id="DivItem2">2</div>
    <div class="DivItem DivRemove" id="DivItem3">3</div>
    <div class="DivItem DivRemove" id="DivItem4">4</div>
    <div class="DivItem DivRemove" id="DivItem5">5</div>
    <div class="DivItem DivRemove" id="DivItem6">6</div>
    <div class="DivItem DivRemove" id="DivItem7">7</div>
</div>

尝试使用：

$(".DivItems").on('click', '.DivRemove', function(){ $( this ).remove() });

正如其他人提到的，指的是。

尝试使用：

$(".DivItems").on('click', '.DivRemove', function(){ $( this ).remove() });

---

正如其他人提到的，引用的概念是。

您需要委托事件处理程序。这是因为元素是动态添加的，而在jQuery初始化时不在DOM中。因此，jQuery几乎不知道这个对象。您可以将事件处理程序委托给页面加载时将存在的对象。例如，如果附加的div位于包装div的内部：

  $('.wrapper').on('click',".DivRemove", function() {
    //do stuff
  });

---

您需要委派事件处理程序。这是因为元素是动态添加的，而在jQuery初始化时不在DOM中。因此，jQuery几乎不知道这个对象。您可以将事件处理程序委托给页面加载时将存在的对象。例如，如果附加的div位于包装div的内部：

  $('.wrapper').on('click',".DivRemove", function() {
    //do stuff
  });

这是以下原则：

根据一组特定的根元素，将一个处理程序附加到与选择器匹配的所有元素的一个或多个事件上（现在或将来） 元素

或者，您可以使用以下选项：

$('.DivItems').on('click', '.DivRemove', function(){ 
    $( this ).remove() });
});

委派事件的优点是，它们可以处理来自子元素的事件，这些子元素将在以后添加到文档中。通过 选择一个元素，该元素保证在 已附加委派事件处理程序，您可以使用委派事件 避免频繁附加和删除事件处理程序

这是以下原则：

根据一组特定的根元素，将一个处理程序附加到与选择器匹配的所有元素的一个或多个事件上（现在或将来） 元素

或者，您可以使用以下选项：

$('.DivItems').on('click', '.DivRemove', function(){ 
    $( this ).remove() });
});

委派事件的优点是，它们可以处理来自子元素的事件，这些子元素将在以后添加到文档中。通过 选择一个元素，该元素保证在 已附加委派事件处理程序，您可以使用委派事件 避免频繁附加和删除事件处理程序

---

这会满足你的需要。这也将绑定到添加到dom中的现有和动态元素

$(document).on('click','.DivRemove',function(){ $( this ).remove() });

---

这会满足你的需要。这也将绑定到添加到dom中的现有和动态元素

$(document).on('click','.DivRemove',function(){ $( this ).remove() });

---

您需要像$document一样使用.DivRemove函数{$this.remove}；您需要像$document一样使用.DivRemove函数{$this.remove}；他需要把活动委派出去。所以更像：$'.DivItems'。在“单击”时，'.DivRemove'，函数{$this.remove}；啊，是的，忽略了正确的语法。谢谢@JackPattishallJr。他需要授权活动。所以更像：$'.DivItems'。在“单击”时，'.DivRemove'，函数{$this.remove}；啊，是的，忽略了正确的语法。谢谢@JackPattishallJr。