JQuery添加/删除列/行动态

我试图删除我动态创建的列。删除列的链接仅适用于第一列。当我按下第二列的链接时，什么也没有发生，但应该显示一条消息。JQuery添加/删除列/行动态

怎么了？

代码：

$(document).ready(function(){ 
    function deleteCol(currentNode){$(currentNode).remove();} 
    function deleteRow(currentNode){$(currentNode).parent().parent().remove();} 
    $('.AddColBtn').click(function(){ 
     var colLength = $('tr.header th.col').length+1; 
     var rowLength = $('.row').length; 
     var vAddColc = $('.col').clone().html(); 
     var vAddColr = vAddColc.replace("Col 1","Col "+colLength); 
     var vAddCol = '<th class="col">'+vAddColr+'</input></th>'; 
     var vAddCell = '<td class="href" onclick="document.location.href="#11">Cell '+colLength+'</td>'; 
     $('.ColAdd').before(vAddCol); 
     $('.RowDel').before(vAddCell); 
    }); 

    $('.AddNewRow').click(function(){ 
     var clonedRow = $('.row').clone().html(); 
     var rowLength = $('.row').length+1; 
     var n = clonedRow.replace("Row 1","Row "+rowLength); 
     var appendRow = '<tr class = "row">' + n + '</tr>'; 
     $('#myPureTable tr:last').after(appendRow); 
    }); 

$("a.delCol").click(function(event) { 
    event.preventDefault(); 
    var colCnt = $('tr.header th.col').length; 
    alert(colCnt); 
    //var current_cell = $(this).closest("td"); 
    //var nb_columns = current_cell.closest('table').find('tr:eq(1) td').length+1; 
    //var column_to_delete = current_cell.prevAll("td").length+1; 
    //if (colCnt>1){deleteCol('table tr td:nth-child('+(nb_columns+'n-'+(nb_columns-column_to_delete))+')');} 

    //$('table tr td:nth-child('+(nb_columns+'n-'+(nb_columns-column_to_delete))+')').remove(); 
    }); 

$('.RowDelete').live('click',function(){ 
     var rowLength = $('.row').length; 
     if(rowLength > 1){deleteRow(this);} 
     else{$('.employmentHistoryForm tr:last').after(appendRow); 
      deleteRow(this);} 
}); 
});

Fiddle

来源

2013-06-04 user2451010

不要只是链接到您的代码：这里包括的相关部分。 –

那是因为你没有考虑到你不绑定动态创建的元素的事实。

变化

$("a.delCol").click(function(event) {

到

$(document).on('click', "a.delCol", function(event) {

来源

2013-06-04 09:17:10

非常感谢您的快速回答。 – user2451010

JQuery添加/删除列/行动态

回答

相关问题