Question

Ran into a problem that has stumped me. I want the border of a row in a table to change colors when a user hovers the cursor over them.

这里是我的 j:

$(document).on( hover ,  .song , function()
{
    $(this).toggleClass( highlightRow );
});

这里是我的html:

<table border="1" style="padding-top:0px; margin-top:0px;">
    <tr class="song"><td>test1</td></tr>
    <tr class="song"><td>test2</td></tr>
    <tr class="song"><td>test2</td></tr>
</table>

这里指:

.highlightRow
{
   cursor: pointer;
   border: 2px solid red;
}

它完全在 Chrome进行。在欧罗尔,曲线向点人变换,这样就是为了把这个类别聚集起来,但边界从未改变肤色。我为此设立了一个支架(http://jsfiddle.net/5a9k2/7/),并做了罚款。谁能告诉我,为什么这在吗?

EDIT: ANSWER Thanks to the answer below I realized that TR s cannot have borders. That being said I needed to keep it working with dynamic elements and wanted to highlight every in the row, not just the one hovered over, so my final JS that worked is:

$(document).on( hover ,  tr.song , function()
{
    $(this).children().toggleClass( highlightRow );
});

Answer 1

边界不能适用于“tr”,而是试图“t”。

http://www.ohchr.org。

替换 j 附有:

$("tr.song td").hover(function(){
    $(this).addClass("highlightRow");
},function(){
    $(this).removeClass("highlightRow");        
});

Answer 2

Your border css should be: border: 2px solid red;

From: http://www.w3schools.com/css/css_border.asp When using the border property, the order of the values are:

border-width
border-style
border-color

如果上述价值观之一缺失(尽管需要边界),只要其他价值符合具体命令,就不成问题。

友情链接