創建「刪除DIV」鏈接

有了這個代碼，我可以添加一個div一些文字和和超鏈接的DIV中：創建「刪除DIV」鏈接

$('<div/>') 
    .html("<a href='#'>x</a> " + i.item.label + " - ") 
    .attr({ 'id': i.item.val }) 
    .addClass('boxClass') 
    .appendTo('#acResults');

我想刪除創建的鏈接時，我點擊在創建的div內的x鏈接上。與本網站的標籤部分中的刪除標籤類似。

你能幫我嗎？

來源

2015-03-19 Diego

因爲元素是動態追加的，所以您需要使用委託事件處理程序。從那裏你可以使用closest()找到父母div並將其刪除。試試這個：

$('#acResults').on('click', '.boxClass a', function(e) { 
    e.preventDefault(); 
    $(this).closest('.boxClass').remove(); 
});

來源

2015-03-19 10:56:12

您可以這樣做：使用.on()（我們爲動態創建的元素添加）添加點擊事件，並使用.remove()刪除點擊鏈接。

$(document).on('click','div.boxClass a',function(){ 
    $(this).remove(); 
});

編輯 - 如OP提到「我想刪除創建的鏈接時，我點擊創建DIV中的X鏈接」在後，但它看起來像OP要刪除div和而不是鏈接。請在下面找到更新的答案 -

$(document).on('click','div.boxClass a',function(){ 
    $(this).closest('div.boxClass').remove(); 
});

來源

2015-03-19 10:55:15

這消除了鏈接，而不是'.boxClass'父DIV。 @Rory McCrossan有正確的做法。 – 2015-03-19 10:59:08

作爲OP提到「我想刪除創建的鏈接，當我點擊創建的div內的x鏈接」，所以我解釋爲只刪除鏈接而不是div。但OP接受了@RoryMcCrossan的回答，所以確認OP想要刪除div而不是鏈接。讓我在回答中更新 – 2015-03-19 11:45:52

將空DIV留在後面沒有實際意義。不要總是從字面上理解問題。 :)我已經刪除了我編輯的DV。 – 2015-03-19 11:48:54

增加一些類此鏈接

$('<div/>') 
    .html("<a class='remove-link' href='#'>x</a> " + i.item.label + " - ") 
    .attr({'id': i.item.val}) 
    .addClass('boxClass') 
    .appendTo('#acResults');

，然後嘗試

$('.remove-link').click(function (event) { 
    event.preventDefault(); 
    $(this).remove(); 
});

來源

2015-03-19 10:59:21 alquist42

如果頁面上有多個'.remove-link'，這將重新添加處理程序。您確實需要使用委託事件處理程序（如其他答案）。這也留下了一個空白的div。 – 2015-03-19 11:00:27

創建「刪除DIV」鏈接

回答

相關問題