当我有鼠标悬停事件时，Animate（）不起作用

Question

我有contextMenu 的这段代码，当删除行时会为行的颜色设置动画，但是当我将mouseout 和mouseover 部分添加到代码中时，已删除行的颜色不再改变：

$(function () {
$('.users').contextMenu({
selector: 'tr',
callback: function (key, options) {
    if (key == 'delete') {
        if (confirm(" Are you sure?")) {
            $.post("../Actions/Delete.ashx", { type: "user", id: $(this).attr('id') });
            $(this).animate({ backgroundColor: '#FF80FF' }, 1000);
        }
    }

},
items: {
    "edit": { name: "edit" },
    "delete": { name: "delete" }
}
});
//newly added part
$('tr').mouseover(function () {
    $('td', this).animate
({ backgroundColor: "#80FF00" }, 300);
});

$('tr').mouseout(function () {
    $('td', this).animate
({ backgroundColor: "white" }, 300);
});
//till here
});

删除确认后我在控制台中看到此错误：

[13:08:10.282] 找不到元素@localhost:1299/Actions/Delete.ashx:1

我哪里错了？

Answer 1

尝试改用mouseenter 和stop() 方法：

{ 动画颜色，我认为你需要包含一个支持它的插件，如 jquery UI}

$('tr').mouseenter(function () {
    $(this).find('td').stop().animate({
        backgroundColor: "#80FF00"
    }, 300);
}).mouseout(function () {
    $(this).find('td').stop().animate({
        backgroundColor: "#ffffff"
    }, 300);
});