创建“删除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”链接

回答

相关问题