Question

我有一个列表视图，当您使用以下代码鼠标悬停时会突出显示一行：

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。

如何制作它以便鼠标悬停时将单元格bgcolor更改为高亮颜色，然后将其设置回来（上面的函数outalt（））？

Answer 1

您可以使用css

.trAlt:hover td{
   background: red;
}

Answer 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;
}

Answer 3

好的，如果您想让bg恢复到原来的状态

在您的tr标签中

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

完成所有这些操作后，添加顶部一路为您提供的样式，并将这些出色的工作放到head标签中……那么当您将鼠标悬停在任何该行中的单元格应突出显示该行中的所有单元格。如果那没有用，请仔细检查您的代码...，然后查找问题。

我还没有使用script标记或asp标记，因为它们只是一些多余的东西，正在干扰单元格，例如...其中一个单元格会变成绿色并保持这种状态，除非您将鼠标悬停在上面它会恢复为绿色。

Answer 4

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

在mouseover上更改单元格bgcolor

4 个答案: