刪除動態創建的內部選定的div

我一直在環顧四周，但我還找不到解決方案。我的代碼是這樣的：刪除動態創建的內部選定的div

$('#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 

});

我有一個名爲「續-DIV」分區包含動態創建的div。可能解決方案非常簡單，但我找不到一種方法來識別'cont-div'內部的點擊div，因此我可以將其刪除。

來源

2013-03-26 Gabriel Moreira

您可以使用事件委派，因爲div s的動態創建：

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

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

});

來源

2013-03-26 20:19:41

也謝謝你！你的代碼也是完美的！ – 2013-03-26 20:41:08

$('#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(); 
    } 

});

來源

2013-03-26 20:17:29 zachzurn

嗯，你的代碼意味着你可能有使用相同ID多個元素。不要那樣做，這會讓事情變得更加困難。只需使用您已設置的類：

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

來源

2013-03-26 20:18:59 mattytommo

有關'id's的觀點是一個很好的觀點。代碼的目的似乎是生成唯一的'id's，儘管從我們可以看到的代碼中，這可能並非如此。 – 2013-03-26 20:29:25

您可以使用jQuery的remove（）要刪除的元素。您還需要一個委託來處理動態插入元素上的事件。

Working Demo

HTML：

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

的Javascript：

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

編輯：縮短下來的代碼片段，現在只顯示相關部分。

來源

2013-03-26 20:26:21

非常感謝！它工作完美！ – 2013-03-26 20:38:24

刪除動態創建的內部選定的div

回答

相關問題