ajax 호출이있는 제브라 테이블

아약스 버튼이있는 테이블에 레코드를 추가하고 있습니다. 얼룩말 표를 사용하고 싶습니다. 제브라 테이블에 jquery 함수가 있습니다.ajax 호출이있는 제브라 테이블

는

<script type="text/javascript"> 
     $(function() { 
      $("table tr:nth-child(even)").addClass("zebraTable"); 
     }); 
</script>

CSS는 :

.zebraTable {background-color: #F2F2F2}

나는 일반 버튼의 클릭에 전화, 그것은 얼룩말 테이블처럼 작동합니다. 하지만 아약스 버튼으로 버튼을 바꿀 때, 테이블은 정상적인 테이블을 켭니다. 의견이 있으십니까?

출처

2012-04-06 Selin

단추 및 테이블 원본에 제공 할 수있는 코드 샘플이 있습니까? – philwinkle

당신은 그런 종류의 테이블을하기 위해 더 이상 자바 스크립트가 필요하지 않습니다. 당신은 직접 CSS에 넣어야합니다. http://www.w3.org/Style/Examples/007/evenodd.en.html – iRyusa

대답은 행에 zebraTable 클래스를 추가 한 이후 테이블에 어떤 일이 발생했는지에 따라 달라집니다. 나는 당신의 Ajax 호출이 테이블을 수정하고 있다고 가정한다. (그것을 대체하고, 행을 추가/제거하고, 행을 숨기거나 표시하는 등)?

DOM의 tr 객체는 제거하지 않고 선택기가 숨겨진 객체와 보이는 tr 객체 모두에 적용된다는 점을 제외하고는 해당 클래스를 유지한다는 점에 유의하십시오. 제 제안은 모든 행에서 zebraTable 클래스를 제거한 다음 다시 적용하는 것입니다 (숨겨진 tr 객체가있는 경우 조정).

출처

2012-04-06 13:59:32 Mayo

방금 버튼 유형을 변경했습니다. 단추 대신 아약스 단추를 사용한 다음 얼룩말 표가 작동하지 않았습니다. – Selin

아아, 당신이 아약스를하는 버튼이라는 것을 알았습니다. Ajax 버튼이 제 3 자 라이브러리에서 가져온 것 같거나 내 Google 기술이 부족합니다. 여하튼, 개발자 도구 모음 (IE/Firefox/Google은 모두 이런 식으로되어 있습니다)을 사용하여 표의 전/후 상태를 검토하십시오. 이렇게하면 버튼을 클릭 한 후 수행해야 할 작업을 결정하는 데 도움이됩니다. 내 생각에 Ajax 버튼이 DOM 요소를 추가/제거하고 CSS 스타일을 잃어 버리는 동안 버튼이 DOM 요소를 변경하고 있습니다 (CSS 스타일 유지). – Mayo

ajax 호출이있는 제브라 테이블

답변

관련 문제