Jquery 将相同的光标和焦点悬停在来自不同div的两个对齐表上

我有一个固定最后一列的可滚动表，因为该列包含操作按钮。 在html代码中，它们看起来像：两个div，每个div中都有一个表，第一个div包含主表，第二个div中我有一个表，只有一列，上面添加了操作按钮。在表格上，当光标经过tr td时，我有一个悬停效果，在焦点上，我应用了不同的背景，以突出显示表格中选定的注册。 我的问题是，当光标经过tr td时，我如何能在展台桌子上同时产生悬停和聚焦效果，因为现在它们在每个桌子上独立工作

请查看我的现场示例：

---

谢谢。

我将使用这个jQuery插件，它可以修复列和行，而不是使用这两个div的方法：

它将使您的HTML更加简单和标准。

请看这里

---

从第二个div到第一个div是否可能有相同的行为？因为现在如果我把光标放在第一个div上，只会选择第一个div表中的元素，但是如果我把光标放在第二个div上，就是选择booth div tr.Thank's.这次我更新了代码，效果很好。非常感谢！！！你认为我们可以把你的功能整合成一个焦点吗？例如：

函数rowSelection（）{$（'table.grid tbody tr td'）。单击（函数（）{var selected=$（this.parent（）；$（'table.grid tbody tr'）。每个（函数（索引）{if（$（this.hasClass（“selectedRow”）{$（this.removeClass（“selectedRow”）；}）；如果（！selected.hasClass（'selectedRow'）{selected.addClass（“selectedRow”）；}}}

非常感谢你，伙计！！！你救了我一天！！！我会尽我所能给你所有分数，再次感谢你。

$(function(){
$('table tr td').click(function () { 
         var selected = $(this).parent(); 
         var index = selected.GetIndex();
            var parentOfRow = $(selected.parent()[0].tagName);

         //First remove the selectedRow class
        $(".selectedRow",parentOfRow).removeClass("selectedRow");
        parentOfRow.each(function(){
               $("tr:eq("+index +")",this).addClass("selectedRow");
         });
    });
$("tr").hover(function(){
     var row = $(this).GetIndex();
    $(".table").each(function(){          
          $("tr:eq("+row+")",this).addClass("hoverx");
    });
},function(){         
     var row = $(this).parent().children().index($(this));
    $(".table").each(function(){          
          $("tr:eq("+row+")",this).removeClass("hoverx");
    });
});
});

    jQuery.fn.GetIndex = function(){
        return $(this).parent().children().index($(this));
    }