如何在鼠标悬停时突出显示不相邻的表格单元格？

我想为循环赛风格的锦标赛设置鼠标悬停突出显示效果，以便当某人将鼠标放在玩家A对玩家B的结果上时，该单元以及显示玩家B对玩家A的结果的单元格是都突出显示。为了说明这一点，这里是我想强调的页面：http://yppc.zzl.org/groups.html。我还没有找到一个可以同时突出显示非相邻单元格的鼠标悬停脚本。我在另一个网站上看到了这种影响，但不幸的是，联赛不在场，分数也被降低了。如何在鼠标悬停时突出显示不相邻的表格单元格？

感谢您的帮助！

来源

2011-07-27 Chad

尝试这样：

<html> 
    <head> 
     <script> 
      function hl(cell, enable) 
      { 
       var rIndex = cell.cellIndex; 
       var cIndex = cell.parentNode.rowIndex; 
       var cell2 = cell.parentNode.parentNode.rows[rIndex].cells[cIndex]; 

       if (enable) { 
        cell.style.backgroundColor = '#000'; 
        cell2.style.backgroundColor = '#000'; 
       } else { 
        cell.style.backgroundColor = '#fff'; 
        cell2.style.backgroundColor = '#fff'; 
       } 
      } 
     </script> 
    </head> 
    <body> 
     <table border="1"> 
      <tr> 
       <td></td> 
       <td>A</td> 
       <td>B</td> 
       <td>C</td> 
      </tr> 
      <tr> 
       <td>A</td> 
       <td></td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">A:B</td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">A:C</td> 
      </tr> 
      <tr> 
       <td>B</td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">B:A</td> 
       <td></td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">B:C</td> 
      </tr> 
      <tr> 
       <td>C</td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">C:A</td> 
       <td onmouseover="hl(this, true)" onmouseout="hl(this, false)">C:B</td> 
       <td></td> 
      </tr> 
     <table> 
    </body> 
</html>

来源

2011-07-27 16:52:36 lazyhammer

如何在鼠标悬停时突出显示不相邻的表格单元格？

回答

相关问题