2014/05/02

[jQuery] 테이블의 행에 선택적 background-color 지정

//pTarget : $("#tableId tbody tr")
//pObj : 선택한 tr object - $(tr)
//ex) ....
 
//테이블 row 선택 시 동적 배경색 지정
function gfnChgRowColor(pTarget, pObj) {
    var viewCnt = 0;
    $.each($(pTarget), function(idx, obj) {
        if("none" != $(this).css("display")) viewCnt++;    //실제 보이는 row count 체크
        
        if($(pObj).index() == idx) {
            if(viewCnt%2 == 0) {
                $(obj).removeClass("table-blue");    //짝수 row 컬러 지정 class
            }
            $(obj).addClass("selected");    //선택한 row 컬러 지정 class
        } else {
            //삭제한 row 컬러 지정 class 는 남겨두고 다른 row들의 class 변경
            if(!$(obj).hasClass("deleted")) {
                $(obj).removeClass("selected");
                if(viewCnt%2 == 0) {
                    $(obj).addClass("table-blue");
                }
            }
        }
    });
}

참고로 jquery 셀렉터의 필터 중에 홀/짝수를 판단하는 필터가 있다.
:even/:odd

댓글 없음:

댓글 쓰기