在鼠标悬停时更改单元格 bgcolor答案

【问题标题】：changing cell bgcolor on mouseover在鼠标悬停时更改单元格 bgcolor
【发布时间】：2012-06-24 14:24:20
【问题描述】：

我有一个列表视图，当您将鼠标悬停在一行时，它会突出显示一行，代码如下：

对于 TR：

<tr class="trAlt" onmouseover="over(this)" onmouseout="outalt(this)">

<script>
    function over(o) {
        if ('trClicked' != o.className)
            o.className = 'trOver';
    function outalt(o) {
        if ('trClicked' != o.className)
            o.className = 'trAlt';
   function clicked(o) {
        o.className = ('trClicked' == o.className) ? 'tr' : 'trClicked';
</script>

现在对于一个特定的单元格，我需要根据它包含的值设置 bgcolor，我这样做是这样的：

<td nowrap="nowrap" bgcolor='<%#Get_BGColor(Eval("Efficiency"),Eval("AvgAdjEfficiency"))%>'>
   <asp:Label ID="EfficiencyLabel" runat="server" 
       Text='<%# Eval("Efficiency") %>' />
</td>

样式标签：

<style>
       /* ItemTemplate TR background colour */
        .tr 
        {
            background-color:#222;
        } 
        /* AlternatingItemTemplate TR background colour */
        .trAlt
        {
            background-color:#595959;
        }
        /* When mouse is over TR background colour */
        .trOver 
        {
            background-color:#898989;
        } 
        /* When mouse click on TR background colour */
        .trClicked 
        {
            background-color:Red;
        } 
    </style>

问题是当鼠标悬停时，上面的单元格会覆盖该行的 bgcolor（上面的函数 over()）。

我怎样才能使它在鼠标悬停时将单元格 bgcolor 也更改为突出显示颜色，然后将其设置回来（上面的函数 outalt()）？

【问题讨论】：

标签： c# asp.net row html-table

【解决方案1】：

你可以使用css

.trAlt:hover td{
   background: red;
}

【讨论】：

仍然没有突出显示我手动设置 bgcolor 的单元格
去掉你手动设置的bgcolor并添加css like .trAlt{ background: your-color; } .trAlt:hover{ 背景：红色； }
但我需要单元格的 bg 颜色不同。不悬停时。因此，如果所有行的正常（未突出显示）bgcolor 为白色，则一个单元格应为绿色。然后当悬停该行时，所有单元格都应该是红色的。
另一种方法，但不确定如何做，是检查单元格的值并将其类设置为将 bgcolor 设置为绿色/橙色/红色的类。但目前我正在检查页面背后代码的值
我让它按小提琴工作，但是当所有其他单元格为红色时（不悬停时），我需要一个单元格保持绿色，当悬停在所有单元格上时应该是红色

【解决方案2】：

  <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
DataSourceID="ObjectDataSource1">
<Columns>
  <asp:TemplateField>
    <ItemTemplate>
      <table>
        <tr>
          <td>
            <%# Eval("ItemID") %>
          </td>
          <td>
            <div class="highlightBox">
              <%# Eval("Title") %>
            </div>
          </td>
        </tr>
      </table>
    </ItemTemplate>
  </asp:TemplateField>
</Columns>

.highlightBox
{

}

.highlightBox:hover
{
  background-color: Yellow;
}

【讨论】：

【解决方案3】：

好的，如果你想让你的bg恢复到原来的样子那么

在你的 tr 标签中

class="trAlt" onmouseover="over(this)" onmouseout="outalt(this)"

一旦你完成了所有这些，添加一直在顶部的那个人给你的样式，并将那件好作品放入 head 标签中......然后你应该看到当你将鼠标悬停在任何该行中的单元格它应该突出显示该行中的所有单元格。如果这不起作用，请查看您的代码...并找出问题所在。

另外，我没有使用脚本标签或 asp 标签，因为它们只是一些额外的东西，会干扰单元格，比如......其中一个单元格会变成绿色并保持这种状态，除非你将鼠标悬停在它上面它会回到保持绿色状态。

【讨论】：

【解决方案4】：

trOver 和 trAlt 的定义是什么？你在那里设置背景颜色吗？

【讨论】：

:(为什么要投反对票？要求更多细节是一种罪过吗？查看user1468537的上述评论......他更新了问题，这帮助他得到了答案。