jQuery를 사용하여 행을 삭제하는 동안 개별 td 제거

Question

웹 응용 프로그램에서 jQuery를 사용하여 HTML 테이블에서 행을 동적으로 추가/삭제하고있었습니다.

개인의 TD 요소 (전체 행이 아닌)를 삭제해야한다는 요구 사항이있었습니다.

$(function() { 

    /* adding new row to existing table */ 
    // HTML template of a row 
    $("#contactInfo").each(function() { 
     $("button.addCommentRow", this).live('click', function() { 

      var curr_row = $(this).closest('tr'); 
      var html = '<tr><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> </td><td> ' + col_ninth + '</td> <td><button type="button" class="addCommentRow">+</button> <button type="button" class="deleteCommentRow">-</button> </td> </tr>'; 

      var newRow = $(html).insertAfter(curr_row); // add after the last 
      newRow.find('.addCommentRow, .deleteCommentRow').button(); 
      newRow.find('.deleteCommentRow').button().click(function() { 

       newRow.find("td:nth-child(9)").remove(); 
       newRow.find("td:nth-child(10)").remove(); 

      }); 
     }); 
    }); 
}); 

을 그래서, 9 내 행에서 10 번째 TD 요소를 제거하고 싶었 삭제에 다음과 같이

내 jQuery 코드입니다.

위 코드 (삭제 부분 만)가 작동하지 않는 것 같습니다.
아이디어를 얻으려면 제안을 받아야합니다.

고마워,
피셔.

Answer 1

이 뭔가를 시도 할 수 있으며, 데모을 시도 : 당신은 아마 이런 식으로 뭔가를 원하는

$(function() { 
    $('tr') 
     .find('td') 
     .append('<input type="button" value="Delete" class="del"/>') 
     .parent()//traversing to 'tr' Element 
     .append('<td><input type="button" value="Delete row" class="delrow" /></td>'); 

    $('.del').click(function() { 
     $(this).parent().remove(); //Deleting TD element 
    }); 

    $('.delrow').click(function(){ 
     $(this).parent().parent().remove(); //Deleting the Row (tr) Element 
    }); 
}); 

Answer 2

나는 Irwin에 동의합니다. http://jsfiddle.net/HXB4Z/

HTML :

<table border=2> 
    <tr> 
     <td>jQuery</td> 
     <td>mootools</td> 
    </tr> 
    <tr> 
     <td>Dojo</td> 
     <td>FUEL</td> 
    </tr> 
    <tr> 
     <td>Raphael</td> 
     <td>Rico</td> 
    </tr> 
    <tr> 
     <td>SproutCore</td> 
     <td>Lively Kernel</td> 
    </tr> 
</table> 

자바 스크립트 :

newRow.find("td:nth-child(9)").html(''); 
newRow.find("td:nth-child(10)").html('');