추가 후 jQuery에서 표 행 재설정/삭제

Question

<table id="myTable" style="width: 650px;"> 
    <tbody> 
    <tr style="font-weight: bold;"> 
     <td>Name</td> 
     <td>Price</td> 
     <td>Supplier</td> 
     <td>Amount</td> 
     <td>Basket</td> 
    </tr> 
    </tbody> 
</table> 

은 내 HTML입니다.

이 내 현재 jQuery를 JS입니다 :

$.post('/ajax/products', { method: 'search', string: searchstring, category: $('#search_category').val() }, function(data) { 
     data = $.parseJSON(data); 
      $('#myTable > tbody:last').append('<tr><td>'+b.name+'</td><td>'+b.price+'</td><td></td><td></td></tr>'); 
     }); 
    }); 

당신이 키 입력 할 때마다, 위의 js를 실행합니다. 이제 쿠키를 찾고 쓰기 시작하면 "C", "Co", "Coo"등의 아약스 게시물을 보냅니다.

이미 첫 번째 아약스 전화에서 시작중인 결과가 발견되었습니다. 따라서 C가 테이블에 추가됩니다. 이제는 "Co"("C"와 동일한 결과)의 결과도 발견되었습니다. 왜냐하면 현재로서는 db의 쿠키 만 있기 때문입니다.

Coo, Cook, Cooki, Cookie, Cookies와 동일합니다. 예. 요점을 얻습니다. 그리고 이것의 결과는 서로에게 덧붙이는 테이블의 많은 부분입니다.

그래서 내가하고자하는 것은 #myTables tbody 안에있는 <tr>의 tbody를 제거하기 전에 (실제로는 $ .post() 앞에 붙이는 것과 같습니다).

그러나 위의 html에서 볼 수있는 것처럼 열 머리글 인 첫 번째 <tr>은 제거하면 안됩니다.

어떻게하면됩니까?

Answer 1

당신의 HTML을 변경하지 않고 당신은 쓸 수 :

var rows = $('#myTable').find('tr'); 
rows.each(function(index, value) { 
    if (index > 0) { 
    $(value).remove(); 
    } 
}); 
$('#myTable > tbody:last').append('<tr><td>'+b.name+'</td><td>'+b.price+'</td><td></td><td></td></tr>'); 

나의 추천 그러나, 테이블 헤더에 대한 th을 사용하는 것입니다 :

<table id="myTable" style="width: 650px;"> 
    <thead> 
    <tr style="font-weight: bold;"> 
     <td>Name</td> 
     <td>Price</td> 
     <td>Supplier</td> 
     <td>Amount</td> 
     <td>Basket</td> 
    </tr> 
    </thead> 
    <tbody> 
    </tbody> 
</table> 

이 그런 다음 자바 스크립트가 될 수 있습니다

$('#myTable > tbody').empty().append('<tr><td>'+b.name+'</td><td>'+b.price+'</td><td></td><td></td></tr>');