0

我有以下代码，当单击复选框时，它会创建一个包含一些信息的 div。但是在那个 div 中，我添加了一个锚标记来删除 div 本身。

但是，我不确定如何删除链接点击上的 div，因为 div 是动态生成的。

//Add selected job in the results div
function AddSelectedJob(id, display) {
    //create a div for every selected job
    $("[id$=ResultsDiv]").append('<div class="selectedjobs" id=' + id + '>' + display + '<a href="#">Remove selected job</a></div>');
}
4

7 回答 7

4

给你div上课并使用on委托事件

尝试这个

$("[id$=ResultsDiv]").append('<div class="selectedjobs" id=' + id + '>' + display + '<a href="#" class="removeJob">Remove selected job</a></div>');

$('[id$=ResultsDiv]').on('click','.removeJob',function(){
    $(this).parent().remove();
})

或者

不使用类

$('[id$=ResultsDiv]').on('click','.selectedjobs a',function(){
    $(this).parent().remove();
})

注意：将它委托给最近的静态父容器比它document本身更好

链接以阅读有关on事件的更多信息

于 2013-06-03T07:13:54.987 回答
4 
$(document).on('click','.selectedjobs a',function(){
       $(this).parent().remove();
});
于 2013-06-03T07:13:27.650 回答
2

使用此代码：-

//在结果div中添加选中的作业

function AddSelectedJob(id, display) {
    //create a div for every selected job
    $("[id$=ResultsDiv]").append('<div class="selectedjobs" id=' + id + '>' + display + '<a href="javascript:;" onclick="removeSelectedJob(this)">Remove selected job</a></div>');
}

function removeSelectedJob(el){
    $(el).parent().remove();
}
于 2013-06-03T07:14:35.823 回答
0

就像是：

$("#ResultsDiv>div.selectedjobs a").click(function(){
    $(this).parent().remove();
});
于 2013-06-03T07:13:46.417 回答
0

在这种情况下，我更喜欢使用 .parents() 。

如果可能的话，给你的锚添加一个类，然后返回 false 或使用 .preventDefault() 来阻止锚的默认操作。

//Add selected job in the results div
function AddSelectedJob(id, display) {
    //create a div for every selected job
    $("[id$=ResultsDiv]").append('<div class="selectedjobs" id=' + id + '>' + display + '<a class="removeSelectedJobs" href="#">Remove selected job</a></div>');
}

$('.selectedjobs .removeSelectedJobs').live('click', function() {
    $(this).parents('.selectedjobs').remove();
    return false;
});
于 2013-06-03T07:31:35.523 回答
0

在这种情况下，通常不会创建 div，而是将其隐藏起来，这样会很麻烦。您可以创建一个具有“display:none;”的 div 在 CSS 中，然后在选中复选框时，您可以使用

$("[id$=ResultsDiv]").show();

当它未被选中时，

$("[id$=ResultsDiv]").hide();
于 2013-06-03T07:21:45.687 回答
0

尝试实时点击...

$(".selectedjobs a").live("click", function(){
    $(this).parent().remove();
});
于 2013-06-03T07:17:51.757 回答