jquery - 带有if语句的jQuery mouseleave（）不起作用

Question

我试图将被点击元素的不透明度保持在 1，而在被点击之前它会使用 mouseenter 和 mouseleave 切换。所以我添加了一个 if 语句来检查元素是否被点击。尽管条件满足，但 mouseleave 函数不会运行。以下是代码：

$('td').mouseenter(function () {
    $(this).fadeTo('fast', 0.99);
});
$('td').mouseleave(function () {
    var $opacity = $(this).opacity;
    if ($opacity < 1) {
        $(this).fadeTo('fast', 0.8);
    }
});
$('td').click(function () {
    $(this).toggleClass('tdClicked');
});

.tdClicked 类只是不透明度为 1 的类。

现在，当我将元素悬停时，它们会亮起，但当我鼠标离开时不会返回。

Answer 1

opacity不是 jQuery 对象的属性。

一种可能的解决方案是测试 td 是否具有tdClicked类而不是测试不透明度值

$('td').mouseenter(function () {
    $(this).fadeTo('fast', 0.99);
});
$('td').mouseleave(function () {
    if (!$(this).hasClass('tdClicked')) {
        $(this).fadeTo('fast', 0.8);
    }
});
$('td').click(function () {
    $(this).toggleClass('tdClicked');
});

演示：小提琴

使用你的方式：小提琴