2011-08-29 5 views
0

사용자 입력을 기반으로 여러 행을 가질 수있는 동적 테이블을 생성 중입니다. 사용자가 행을 선택/클릭 할 때 행의 배경색을 변경하고 싶습니다. 내 코드는 다음과 같습니다동적 테이블의 특정 행 (onClick 이벤트)의 배경색 변경

table.resulttable tr.altcol_blue td{ height:20px; font-family:Arial, Helvetica, sans-serif; font-weight:normal; color:#444444; font-size:11px; background-color:#deedf5; vertical-align:middle; padding-left:5px;} 
+0

그'.live' 핸들러는 반복 가능한 함수 인 것처럼 보이는 것 안에서 꽤 틀린 것처럼 보입니다. 한 번 설정해야합니다. – Zlatev

+0

Very True ... 첫 번째 두 가지 접근 방식이 제대로 작동하지 않았으므로 다른 라이브 이벤트를 도입하여 시도했습니다. 이는 필수 사항이 아니며 ... 너무 효과적이지 않았습니다. – Biki

답변

0

이 게시물에 따르면, 당신이 알고 싶은 생각 :

function Contact_OnUpdateTelephone() { 
    $('#tableTelephone > tbody > tr').remove(); 
    for (var c = 0; c < _updatedTelephoneList.length; c++) { 
     var index = _updatedTelephoneList[c].Index; 
     var id = _updatedTelephoneList[c].Id; 

     $('#tableTelephone tbody:last').append("<tr onclick = GetTelephoneData(" + index + ",'" + id + "');><td>" + index + "</td><td>" + id + "</td></tr>");   
    }  
} 



function GetTelephoneData (index, id) { 

//Change the color of the clicked (selected) row 

//  $("#tableTelephone tbody tr").removeClass("altcol_blue"); 
//  $(this).addClass("altcol_blue"); 

//  $("tr").click(function(){ 
//   $(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue"); 
//  }); 

     $("#tableTelephone tr td").live('click', function() { 
      $(this).addClass("altcol_blue").siblings("tr").removeClass("altcol_blue"); 
     }); 

Var SelectedIndex = index; 
... 
... 

    } 

내 CSS는 같습니다 (주석으로 부분은 내가 만든 재판,하지만 그들은 작동하지 않습니다) 배경색을 어떻게 바꿀 수 있습니까?

이 경우 당신은 내가에서 여기에 아이디어 하나 개의 행을 하일 원하는 :

$("#tableTelephone tr td").each(function() { 
     if ($(this).parent().hasClass("altcol_blue") == false) 
     { 
      $("#tableTelephone tr").removeClass("altcol_blue"); 
      $(this).parent().addClass("altcol_blue"); 
     } 
    }); 

이런 식으로 뒤에 아이디어는, 클래스 'altcol_blue가'이전 행에서 제거됩니다 있는지 확인하는 것입니다 (들).