Question

.hover()

有点麻烦

我正抓住一些运球镜头，这些镜头在页面加载时被拉入。由于某些原因，通过悬停添加一个类不希望对它们起作用。

虽然它与标准列表完美配合。

JS：

$("#dribbble li").hover(

function () {
    $(this).addClass("hover");
},

function () {
    $(this).removeClass("hover");
});

HTML

<div id="dribbble">
<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

Answer 1

使用委托 - 我猜你的元素没有被绑定，因为它们在绑定时在dom中不可用

$("#dribbble").on({
    mouseenter: function () {
       $(this).addClass("hover");
    },
    mouseleave:function () {
       $(this).removeClass("hover");
    }
},'li');

如果您希望它优先于其他样式，您还必须更加具体了解

#dribbble li.hover {
    background-color:aqua;
}

FIDDLE

Answer 2

您需要将事件处理程序附加到已存在的元素。在创建li元素时，必须绑定到父元素，然后过滤到所需的元素（正确完成后实际需要）。

尝试：

$("#dribbble").on('mouseenter','li',function () {
    $(this).addClass("hover");
});

$("#dribbble").on('mouseleave','li',function () {
    $(this).removeClass("hover");
});

jQuery - 悬停不起作用

2 个答案: