선택한 행을 리피터에서 강조 표시하는 방법은 무엇입니까?

Question

리피터가 있습니다. 그 중 원하는 행을 선택하거나 클릭하면 강조 표시됩니다.

<tr id="gh" style="cursor: pointer" onclick="Select(this);"> 

어떤 자바 스크립트 년대 스타일의 코드입니다 : - -이 : 다른 row.My 코드 인 경우에 선택합니다 내가 선택한 행이 강조합니다 자바 스크립트의 일부 코드를했지만, 강조 표시를 해제하지 않은

<style type="text/css"> 
    .highlight 
    { 
     background-color: Red; 
    } 
    .selected 
    { 
     background-color: #ffdc87; 
    } 
</style> 

<script type="text/javascript"> 
    function Select(obj) { 
     obj.className = 'selected'; 
     var tbl = document.getElementById("Repaddressorbbl") 
     var firstRow = tbl.getElementsByTagName("TR")[0]; 
     var tableRowId = tbl.rows[firstRow.getElementById("gh").parentNode.id]; 
     alert(tableRowId); 
     var oldRow = tbl.rows[firstRow.getElementsByTagName("tr")[0].value]; 
     if (oldRow != null) { 
      oldRow.className = ''; 
     } 
     firstRow.getElementsByTagName("tr")[0].value = obj.rowIndex; 

    } 

</script> 

우리는 코드 뒤에 간단히 할 수 있지만 문제는 jquery 또는 javascript로만 수행해야한다는 것입니다.

Answer 1

이 유사한 코드를 사용할 수 있습니다

var INDEX = $(this).parent().children().index($(this)); 
$('#Repaddressorbbl tr:nth-child(' + INDEX + ')').addClass("highlight") 
         .siblings() 
         .removeClass("highlight"); // remove css class from other rows 

그것은 TR의 ROWNUMBER을 얻고, 다른 모든 거래 정보 저장소에서 같은 클래스를 제거하는 동안 CSS 클래스를 추가합니다. jQuery를위한

Answer 2

업데이트 :

$(document).ready(function() { 
    $("tr").click(function() { 
     $(this).addClass("highlight").siblings().removeClass("highlight"); 
    } 
} 

원래 답 : 내가 제대로 이해하면

, 테이블의 모든 행은 다음과 같이 정의된다 :

<tr id="gh" style="cursor: pointer" onclick="Select(this);"> 

그리고 설정할 이전에 클릭/선택된 행에서 클래스를 지우면서 가장 최근에 클릭 한 행의 클래스를 선택하여 보입니까?

그렇다면, 함수의 매우 단순화 된 버전을 수행해야합니다 나는 당신이 firstRow.getElementsByTagName("tr") 물건을하려고하는지 이해가 안

var selectedRow = null; 

function Select(obj) { 
    if (obj != selectedRow) { 
     if (selectedRow != null) { 
     selectedRow.className = ''; 
     } 
     obj.className = 'selected'; 
     selectedRow = obj; 
    } 
} 

. 중첩 된 테이블이 있습니까?

Answer 3

난 당신이 인덱스를 필요합니까 왜 easly 클래스

onload=function(){ 
    if (document.getElementsByClassName == undefined) { 
     document.getElementsByClassName = function(className) 
     { 
      var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)"); 
      var allElements = document.getElementsByTagName("*"); 
      var results = []; 

      var element; 
      for (var i = 0; (element = allElements[i]) != null; i++) { 
       var elementClass = element.className; 
       if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass)) 
        results.push(element); 
      } 

      return results; 
     } 
    } 
} 
function Select(obj) { 
    var oldRow = document.getElementsByClassName('selected'); 
    if(oldRow.length > 0) 
     oldRow[0].className = ''; 
    obj.className = 'selected'; 
}