JQuery удалить строку таблицы не работает

Question

В принципе, нажмите кнопку, чтобы создать строку таблицы, затем нажмите кнопку «минус», чтобы удалить строку.

Я пробовал это несколькими способами ниже, без работы. -.bind -.live -нормального путь

Похоже, что он не работает из-за столом генерируется динамически.

<script language="JavaScript" src="jquery-1.4.3.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 

$(document).ready(function() {  

    var html = ''; 
    var rows= 5; 
    var cols= 4; 

    $('#btnGenTable').bind("click", function() { 

    for (var r = 1; r <= rows; r++) 
    { 
    html += '<tr>'; 

    for (var c = 1; c <= cols; c++) 
    { 
    cellText= "row " + r + " col " + c; 
    html += '<td>aa</td>'; 
    } 

    html+= '<td><img class="delete" src="minus.jpg" /></td>'; 

    html += '</tr>'; 
    }; 


    $('.inner').html('').append(html); 

    }); 


$('table tbody tr td img.delete').click(function(){ 
    alert('clicked'); 
     $(this).parent().parent().remove(); 
}); 

}); 

</script> 

<br /> 


<table id="tblsize" class="inner" border="1" width="80%"> 
</table> 


<input type=button value="Generate Table" name="btnGenTable" id="btnGenTable" class=text100> 

Answer 1

Чтобы удалить строку при щелчке изображения, вставьте следующий код в блок $ (document) .ready.

$('img.delete').live('click', function() { 
    $(this).parent().parent().remove(); 
}); 

Answer 2

все, что вам нужно:

$('.delete').live('click', function(){ 
      $(this).closest('tr').remove(); 
     }); 

в вашем документе готовый обработчик.

вот рабочий пример: http://jsfiddle.net/5bWcT/

Answer 3

Я знаю, этот вопрос старый, но у меня была такая же проблема. Теперь метод live() устарел с версии jQuery версии 1.7 и будет удален в версии 1.9. Вы можете использовать это вместо:

$(document).on('click', '.delete', function(){ 
    $(this).closest('tr').remove(); 
});