2012-10-12 5 views
0

15 개의 열과 2000 개가 넘는 레코드가있는 표가 하나 있습니다. 이제 마지막 5 열을 숨기거나 표시하고 싶습니다. 이를 위해 jQuery 문을 사용합니다.Jquery 여러 표 셀에 대해 표 셀 숨기기/표시

$("table.border-box td.disp").toggle(); 

"disp"클래스를 가진 td는 표 셀을 숨기거나 표시합니다.

하지만 브라우저에서 다음과 같은 중지 스크립트 오류가 발생합니다.

이 페이지의 스크립트가 사용 중이거나 응답하지 않을 수 있습니다. 스크립트를 지금 중지하거나 스크립트가 완료되는지 계속 확인할 수 있습니다.

Script: http://localhost:8080/XXX/resources/js/jquery/jquery-1.6.4.js:4055 

어떻게이 최적화 할 수 있으며 브라우저 오류를 해결 (브라우저 : 모질라 파이어 폭스 : 15.0). 이미 여러 페이지에 결과를 분할해야 언급 된 다른 사람으로

+0

하나의 사이트에 모든 게시물을 표시하고 있습니까? – intelis

+0

페이징 방법을 사용하여 페이지의 레코드를 제한하거나 내용을 lazyloading하는 레코드를 제한하는 것이 좋습니다. – Vimalnath

+0

안녕하세요. 문제를 해결했지만 td를 토글하는 대신 CSS를 토글했습니다. css ("display", "table-cell");'$ (". disp") .css ("display", "none"); 그것은 원활하게 작동합니다. –

답변

1

시도해보십시오 : 또한

$("table.border-box").find(".disp").toggle(); 

같이, 그것은 또 다른 시간을 사용하여 그것을 캐시 :

tds = $("table.border-box").find(".disp");//only do expensive operation once 

tds.toggle(); 
... 
... 
tds.toggle(); 

복잡한에 사용되는 당신이 querySelectorAll()을 사용하는 performance penalty을 피하는 것이 방법으로 jquery는 내부적으로 더 많은 성능 인 getElementsByTagName()을 사용하므로 ".class"와 같이 간단한 것들을 중첩하는 것이 더 좋습니다.

분명히 충분하지 않다면 다른 답변과 마찬가지로 코드를 리팩터링해야합니다.

0

. 그러나 이것을 수행 할 수 없다면 다른 행은 아니지만별로 좋지 않은 접근 방법은 각 행을 수동으로 반복하고 토글 이벤트를 비동기 적으로 실행하는 것입니다.

1

코드는 완벽하게 훌륭합니다.

나는이 테스트를 위해 JS 바이올린을 만들었습니다 http://jsfiddle.net/3z7Ze/

하는 레코드가 당신이/숨기기 열을 보여주기 위해 노력하고있다 완전히 전에로드되어 있는지 확인합니다. 그리고 그 당시에는 실행중인 다른 스크립트가 없습니다 (표시/숨기기 기능과 충돌 할 수 있음).