使用 jQuery 突出显示表格行背景颜色答案

【问题标题】：Highlight table row background color with jQuery使用 jQuery 突出显示表格行背景颜色
【发布时间】：2012-07-16 17:34:24
【问题描述】：

我正在使用 jQuery 1.7.2 和 jQuery UI 1.8.21。我想突出显示表格中的特定行，但这似乎不起作用：

<script language="javascript" type="text/javascript">   
$(document).ready(function() {      
     $('#tr635').effect("highlight", {}, 3000); 
});
</script>

#tr635 是我希望突出显示的 tr 的 id。我究竟做错了什么？

编辑：

表格的 HTML 代码：

<table width="100%">
  <tr>
    <td colspan="8" class="title">Prioritize Liabilities</td>
  </tr>
  <tr>
    <td class="info">Note</td>
    <td class="info">Balance</td>
    <td class="info">Total Debt</td>
    <td class="info">Total Loss<br />Given Default</td>
    <td class="info">% Loss<br />Guarantee</td>
    <td class="info">Total Loss<br />After Guarantee</td>
    <td class="info">% Loss</td>
    <td class="info">Note LGD</td>
  </tr>
  <tr id="tr632">
    <td><em>GGA 01</em></td>
    <td>5,000</td>
    <td>5,000</td>
    <td>0</td>
    <td>0%</td>
    <td>0</td>
    <td>0.00%</td>
    <td>D</td>
  </tr>
  ...more rows...
</table>

编辑 2：我找到了答案。在我的表格的 CSS 中，我为表格中的 td 标签指定了背景颜色。我删除了它并在 tr 标签中设置了背景颜色。现在它起作用了。看起来 td 标签的 CSS 覆盖了 jQuery。

【问题讨论】：

不，没有收到错误。只是不工作。
确保 id 正确。 Example.
如果您的tr>td 为空，那么它可能不起作用，因为您看不到它。
你能发布你的表格的html代码吗？
只要 ID 存在就可以正常工作：jsfiddle.net/j08691/eANJH

标签： jquery jquery-ui background html-table highlight

【解决方案1】：

我找到了答案。在我的表格的 CSS 中，我为表格中的 td 标签指定了背景颜色。我删除了它并在 tr 标签中设置了背景颜色。现在它起作用了。看起来 td 标签的 CSS 覆盖了 jQuery。

【讨论】：

【解决方案2】：

您是否包含用户界面？这是我看到的唯一区别：jsFiddle Example (click on/off UI include) 这与fadein 可以工作的事实保持一致......因为fadein 包含在主jquery 库中，而.effect 是一个UI 组件。

【讨论】：

是的，我包括了 jQuery UI。