preventDefault не работает с jQuery.live

Question

У меня есть этот кусок JS:

$('.self_delete').live('click', function(e){ 
    e.preventDefault(); 
    $.ajax({ 
     type: 'DELETE', 
     url: $(this).attr('href'), 
     success: $(this).parent().remove(), 
     dataType: "script" 
    }) 
}); 

которые нацелены на этот HTML:

<a href="/list_items/34" class="self_delete" data-method="delete" rel="nofollow"> 
    <i class="icon-trash"></i> 
</a> 

Проблема заключается в том, что, когда я нажимаю на ссылку, он будет сначала отправьте вызов ajax на сервер. THEN отправляет обычный вызов HTML. Конечно, этот беспорядок происходит после того, как list_item уже удален.

У меня такое чувство, вызванное вызовом live(), но я не могу понять, почему. Мой JS-Fu нуждается в обучении!

---

EDIT изменил код так:

$('.self_delete').live('click', function(e){ 
    e.preventDefault(); 
    var self = $(this); 
    $.ajax({ 
     type: 'DELETE', 
     url: self.attr('href'), 
     success: function(){ self.parent().remove() }, 
     dataType: "script" 
    }) 
}); 

И я до сих пор тот же вопрос. Пытался заменить .live на .on, но он даже не пытался отправить через AJAX, поэтому я думаю, что мне придется более внимательно прочитать документ: -S

Answer 1

Вам необходимо обернуть свой код успеха анонимной функцией, на данный момент он будет работать сразу, а также хранить ссылку на $(this) в другой переменной, например self

$('.self_delete').live('click', function(e){ 
e.preventDefault(); 
var self = $(this); 
$.ajax({ 
    type: 'DELETE', 
    url: self.attr('href'), 
    success: function(){ self.parent().remove() }, 
}) 
}); 

на стороне записки, вы должны использовать .on от JQuery 1.7 .live устарела.

$(document).on('click', '.self_delete', function(e){ 
    e.preventDefault(); 
    var self = $(this); 
    $.ajax({ 
     type: 'DELETE', 
     url: self.attr('href'), 
     success: function(){ self.parent().remove() }, 
    }) 
});