Question

我尝试在客户端运行以下脚本，但目前没有突出显示表id = tbDetails

的行

<script type="text/javascript">
    $("#tbDetails tbody tr").hover(

function () {
    $(this).css({
        background: 'yellow'
    });
},

function () {
    $(this).css("background", "");
}
);
</script>

我使用浏览器工具调试了脚本，脚本抛出了以下错误 - ReferenceError: $ is not defined。我通过将以下jquery库添加到我的html解决了这个错误，但上面的脚本仍然无法在我的客户端工作。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

这里是我的html和javascript的完整视图： JSFiddle HTML example

有什么建议吗？

Answer 1

首先将jQuery添加到你的小提琴中。同时从中移除background-color: #ffffff; table.gridtable td上课。

This是您在评论中发布的更新小提琴。

Answer 2

只需删除background-color:#ffffff

即可

table.gridtable td
{
    border-width: 1px;
    padding: 6px;
    border-style: solid;
    border-color: #ffffff;
}

Answer 3

$(this).css("background", "");应为$(this).css({"background": ""});而$(this).css({background: 'yellow'});应为$(this).css({"background": 'yellow'});

$("#tbDetails tbody tr").hover( function () {
        $(this).css({ 'background': 'yellow'});
    },
    function () {
        $(this).css({"background": ""});
    });

<强> DEMO

Javascript悬停事件

3 个答案: