我使用以下代码创建三行表。第一行和第三行包含数据。但是第二行本身不能有数据。我使用悬停方法可以正确选择行。但是我没有需要选择空行。这意味着如果我将鼠标悬停在空行上,它也会被选中。如何防止突出显示空行?
表创建:
<table id="asdf">
<tbody>
<tr>
<td>Lorem</td> <td>Ipsum</td> <td>Fierent</td>
</tr>
<tr>
<td style="height:10px" colspan=3></td>
</tr>
<tr>
<td >mnesarchum ne </td> <td >sapientem</td> <td >fierent mnesarchum </td>
</tr>
</tbody>
</table>
Jquery For 调用悬停:
$('#asdf tr').mouseover(function() {
$(this).addClass('hovered');
}).mouseout(function() {
$(this).removeClass('hovered');
});
鼠标悬停方法:
.hovered td {
background: #ddd;
}
最佳答案
使用 .text() 检查你的“空”行
$('#asdf tr').mouseover(function() {
if($.trim($(this).text()) != '')
$(this).addClass('hovered');
}).mouseout(function() {
$(this).removeClass('hovered');
});
关于jquery - 使用悬停突出显示 Html 表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11624489/