Удалить Div по ссылке нажмите

Question

Я делаю код, в котором я хочу удалить div, когда его внутренняя ссылка («Удалить») нажата. Я знаю, что этот вопрос может повторяться, и я пробовал так много методов, но не работал. Я не знаю, в чем проблема.

Вот мой HTML Rendering Код:

<div id="ViewRows"> 
    <br> 
    <div class="ViewRow"> NOS: FA Comment: finance 
     <a class="deleteViewRow" href="#">Delete</a> 
    <br> 
    </div> 
    <div class="ViewRow"> 
     NOS: TPA Comment: Assistance 
     <a class="deleteViewRow" href="#">Delete</a> 
     <br> 
    </div> 
</div> 

Вот мой код Javascript для удаления этого дел.

$("a.deleteViewRow").live("click", function() { 
    $(this).parents("div.ViewRow:first").remove(); 
    return false; 
}); 

Я также попытался следующие JavaScript:

$("#ViewRows").on("click", "a.deleteViewRow", function() { 
    $(this).closest("div.ViewRow").andSelf().remove(); 
    return false; 
}); 

Я попробовал тот же код на другой странице. Он работает, но когда я применил ту же логику на другой странице. Это не работает. Я знаю, что вы все правы, но я не знаю, в чем проблема. В firebug он даже не входит в функцию.

Answer 1

это простой, но эффективный код работает отлично: http://jsfiddle.net/L2CsH/

$("#ViewRows").on("click", "a.deleteViewRow", function() { 
    $(this).parent().remove(); 
}); 

Answer 2

необходимо предотвратить действие ссылки по умолчанию. event.preventDefault()

$("#ViewRows").on("click", "a.deleteViewRow", function (e) { 
    e.preventDefault(); 
    $(this).closest("div.ViewRow").remove(); //.andSelf() is not needed here. 
    //return false; 
}); 

Демо: Remove Div JSFiddle

Answer 3

Это должно работать:

$("#ViewRows").on("click", "a.deleteViewRow", function (e) { 
    // prevent browser from following link 
    e.preventDefault(); 
    // ".andSelf()" can be skipped - once the parent div is removed, the link gets removed as well 
    $(this).closest("div.ViewRow").remove(); 
});