2011-07-28 4 views
6

현재 jQuery의 숨기기/표시 기능을 사용하여 선택 상자의 그룹으로 표를 필터링하는 데 도움이됩니다.hide/show는 매우 느립니다.

실제 코드는 정상적으로 작동하지만 엄청나게 느리며 때로는 1 ~ 2 분 정도 걸립니다.

나는 코드 그래서 대신 숨기기() 및 표시()가 css({'display':'none'}); 사용하고 css({'display':'block'}); 전환 - 는 속도 차이는, 지금 바로 초를 단순히 믿을 필요하지만, 파이어 폭스에서 테이블 데이터가 모두 각 행에 대해 숙청된다 .

인터넷 익스플로러를 거의 독점적으로 사용하고 있기 때문에 세상이 끝난 것은 아니지만 상당한 분량의 사람들이 Firefox를 사용하기 때문에 주변에 방법이 있는지 궁금해하고 있습니다.

답변

4

테이블 행을 표시하거나 숨기려면 firefox에서 다음을 설정해야합니다.

//To show 
$("tr").css("display", "table-row"); 

//To hide 
$("tr").css("display", "none"); 
+0

이것은 IE뿐만 아니라 tr가 블록 요소가 아닌 'table-row'의 디스플레이 유형이어야합니다. – scrappedcola

+1

실제로 jquery show/hide를 사용하는 것이 더 좋습니다. 이러한 조건. – ShankarSangoli

+0

많은 감사합니다. 이것은 실제로 완벽합니다! Firebug를 사용하여 이전에 테이블 셀 값이 있다는 것을 알아 냈습니다 (물론 작동하지 않았습니다). 그러나 이것은 완벽합니다! 불행히도 나는 정말로 show/hide를 사용할 수 없다. - 처리하는 데 영원히 걸린다. http://www.learningjquery.com/2010/05/now-you-see-me-showhide-performance –

1

jQuery API는 .show 및 .hide 함수의 지속 시간을 설정할 수 있습니다. 나는 이것이 당신의 문제를 해결할 수 있다고 생각합니다.

the docs for .show()을 참조하십시오.

the docs for .hide()을 참조하십시오.

+0

많은 감사합니다. 이전에 (0)으로 설정했기 때문에 문제가되는 애니메이션이 아니 었습니다. 그것을 죽였다. - http://www.learningjquery.com/2010/05/now-you-see-me-showhide-performance –

+0

@xn dx 속도를 0으로 설정하면 jQuery가 애니메이션을 사용하여 값을 변경해야하므로, 속도를 줄이면 그냥 비워 두십시오. 또한 표시/숨기기 oly CSC를 변경하지만 그들은 적절한 가시성으로 복원 할 수 있도록 이전 값을 캐시합니다. – Andrew

+0

아! 나는 0으로 속도를 설정하는 것이 여전히 애니메이션, 많은 감사를 유발할 줄 몰랐다. –

1

show() 및 hide()의 지속 시간에 대한 대답은 좋습니다. 그러나 행 수가 너무 많으면 show()display: block 또는 display: table-row의 차이는 각 행에 대해 show()이 애니메이션을 실행한다는 것입니다. 이것은 확실히 느려질 수 있습니다. 특히 큰 테이블에서는 느려질 수 있습니다.

성능을 크게 향상 시키려면 jqGrid 또는 SlickGrid의 소스 코드를 살펴보십시오. 후자의 경우 명확하게 작동 할 수있는 미친듯한 빠른 필터링 기능이 있습니다. 너무 복잡하다면 display: block 또는 display: table-rowdisplay: none으로 가십시오. showFast 및 hideFast를 수행하는 자체 jQuery 플러그인을 만들어 코드를 반복 할 필요가 없습니다.

+0

이것은 훌륭한 조언입니다, 감사합니다! 그냥 SlickGrid를보고, 정말 좋아 보인다 :) –

관련 문제