두 개의 다른 테이블에서 동일한 인덱스의 행 선택

Question

미리 질문 해 주셔서 감사합니다. 나는 테이블 행을 선택하고 배열을 넣을 두 개의 html 테이블을 가지고있다. 표 1의 ID는 #name이고 표 2의 ID는 # 이름 2입니다. 이것은 ctrl 키를 누른 상태에서 배열로 밀어 넣을 행을 토글하는 함수입니다. 나는 Ctrl 키를 누른 채로 한 테이블의 행을 클릭하면 다른 테이블의 동일한 인덱스 행에 적용되므로 함수를 작성하려고합니다.

function rowSelect(element){ 
var self = this; 
self = 0; 
var isCtrlDown = false; 

element.on('click', 'tr', function(){ 
    var tr = $(this); 
    if(!isCtrlDown) 
     return; 
    tr.toggleClass('ui-selected') 
}) 

$(document).on('keydown', function(e){ 
    isCtrlDown = (e.which === 17) 
}); 

$(document).on('keyup', function(e){ 
    isCtrlDown = !(e.which === 17) 
}); 

self.getSelectedRows = function(){ 
    var arr = []; 
    element.find('.ui-selected').each(function(){ 
     arr.push($(this).find('td').eq(0).text()) 
    }) 

    return arr; 
} 

return self; 


} 

    window.myElement =rowSelect($('#name')) 
    window.myElement = rowSelect($('#name2')) 

Answer 1

가장 쉬운 방법은 같은 클래스를 두 행에서 동시에 전환하는 것입니다. 클릭 한 색인을 가져온 다음 색인별로 행을 선택하고 한꺼번에 전환 할 수 있습니다.

element.on('click', 'tr', function(){ 
    var index = $(this).index(); 
    if(!isCtrlDown) 
     return; 
    $('tr:nth-child(' + (index + 1) + ')').toggleClass('ui-selected'); 
}) 

이 솔루션은 두 행이 다음 그들에게 모두 또는 둘을 얻을 것이다별로 요소를 선택, 항상 함께 전환되고 있음을 보장합니다. 또한

, 당신이 같이 갈 경우 : 한 번에 두 테이블에 이벤트를 첨부 할 수 있습니다

rowSelect($('#name, #name2')) 

.