Question

我一直在四处寻找，但我找不到解决方案了。我的代码是这样的：

$('#addDiv').click( function() {

          var divNum = divNum + 1;
          var newdiv = document.createElement('div');
          var divIdName = 'mydiv';
          newdiv.setAttribute('id',divIdName+divNum);
          newdiv.className = 'imgDiv';

});

$('#cont-div').on('click', function(e) {

        //REMOVE clicked div

});

我有一个名为“cont-div”的div，它包含动态创建的div。可能解决方案很简单，但我找不到一种方法来识别'cont-div'中的点击div，所以我可以删除它。

Answer 1

您可以使用事件委派，因为div是动态创建的：

$('#cont-div').on('click', 'div', function(e) {

        //REMOVE clicked div
        $(this).remove();

});

Answer 2

$('#cont-div div').on('click', function(e) {

    var clickedDiv = e.target;

    if(clickedDiv != e.currentTarget)
    {
        //Remove the clicked div if it is not the parent.
        $(this).remove();
    }

});

Answer 3

嗯，你的代码暗示你可能有具有相同ID的多个元素。不要这样做，这会让事情变得更难。只需使用您设置的课程：

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

Answer 4

您可以使用jquery remove（）删除元素。此外，您还需要一个委托来简单处理动态插入元素上的事件。

Working Demo

<强> HTML

<input id="addDiv" type="button" value="click!" />

<强>使用Javascript：

$(function(){
    $('body').on('click','.imgDiv',function(){
        $(this).remove();
    });
});

编辑：缩短代码段，现在只显示相关部分。

删除动态创建的内部选定div

4 个答案: