jQuery를 사용하여 동적으로 추가 된 테이블 행 수를 계산하는 방법은 무엇입니까?

jQuery로 동적으로 추가 된 테이블 행을 어떻게 계산합니까?jQuery를 사용하여 동적으로 추가 된 테이블 행 수를 계산하는 방법은 무엇입니까?

나는 $('#mytbody').children().length;으로 시도했지만 동적으로 추가 된 행에는 작동하지 않습니다. 확실하지 TBODY에 작용하는 것은하지 않는 이유 - 여기

<!DOCTYPE html> 
<html> 
<head> 
<script src="jquery-1.6.2.min.js"> 
<script> 
$(function() { 
    $('#add').bind('click', function() { 
     $('#mytbody').after('<tr><td>'+ new Date() +'</td></tr>'); 
     var count = $('#mytbody').children().length; 
     $('#counter').html(count); 
    }); 
}); 
</script> 
</head> 
<body> 
<button id="add">Add row</button> 
<table> 
    <tbody id="mytbody"> 
    </tbody> 
</table> 
Number of rows: <span id="counter"></span> 
</body> 
</html>

출처

2011-09-29 Jonas

당신은 TBODY 이외의 행을 추가한다.

변경 afterprepend에

는 .after()을 .append()를 사용하지 않을 필요가

또는 변경 횟수

http://jsfiddle.net/H8sBr/442/

출처

2011-09-29 10:06:11

감사합니다.'after'를'prepend'로 바꾸면 문제가 해결되었습니다. – Jonas

이 jsfiddle이 작동하지 않습니다. 행 수는 항상 0으로 표시됩니다. 나는 그것이 어떻게 대답으로 선택되었는지 이해하지 못한다! @meo의 솔루션은 훌륭하게 작동합니다. – Zeeshan

안녕하세요 @ sankar.suda .... Jsfiddle doesn't는 일합니다. 이걸 어떻게 얻을 수 있는지 알려주십시오 ...이 문제를 해결하는 방법 ... –

내 코드,

var count = $('table tr').length;

이 작동하는 것 같다에 수를 변경하려고합니다.

편집 : jsFiddle

출처

2011-09-29 10:04:39 whostolemyhat

Just use a counter,it has less dom lookups :

$(function() { 
    $('#counter').html(0); 
    var count = 1; 
    $('#add').bind('click', function() { 
     $('#mytbody').after('<tr><td>'+ new Date() +'</td></tr>'); 
     $('#counter').html(count); 
     count++ 
    }); 
});

출처

2011-09-29 10:05:00 NimChimpsky

이미 거기에있는 tr의 길이에 카운터를 설정하면 완벽 할 것입니다. 아마도 어쩌면 거기에 약간의 숫자가있을 수도 있습니다. – meo

이것은 또한 작동하지만 다른 변수를 도입하지 않는 것을 선호합니다. – Jonas

http://jsfiddle.net/H8sBr/2/

var count = $('table tr').length;에 .. 작동합니다 . 후 요소를 추가 귀하의 tbody하지만 당신은 귀하의 tbody 내부 요소를 계산합니다. append를 사용하면 tbody의 끝에 추가합니다. 또는 .prepend()을 사용하여 테이블 상단에 항목을 추가 할 수 있습니다.

추신 : 이것은 CSS 선택기 .after() 때문에 요소가 아닌 선택한 요소의 내용 뒤에 내용을 추가하기 때문에 잘못된 생각입니다.

출처

2011-09-29 10:13:06 meo

안녕 @meo .... 많이 감사합니다 완벽하게 작동합니다 .... 나는 당신의 도움으로 이것을위한 해결책을 얻습니다. –

jQuery에는 버그 (확실하지 않은 것)가 있습니다. 테이블 행을 동적으로 추가하면 행 길이가 업데이트되지 않습니다.

var rowCount = $("#tableId > tbody > tr").length;

동적으로 행을 추가하면 정확한 개수가 반환되지 않습니다.

var rowCount = document.getElementById("tableId").rows.length;

예, 자바 스크립트와 jQuery를 사용할 수 있습니다

간단한 솔루션을 사용하는 것입니다.

출처

2014-01-29 16:43:39

작동하지 않습니다 .... PAL –

jQuery를 사용하여 동적으로 추가 된 테이블 행 수를 계산하는 방법은 무엇입니까?

답변

관련 문제