javascript - jQuery - 在 DOM 更改后悬停

Question

使用 $('#sidebar').toggleClass('small'); 我正在添加从 #sidebar 中添加/删除指定的类。

当 #sidebar 具有类 small 时，当用户将鼠标悬停在 #sidebar.small 上时，我应该能够执行其他操作。

我尝试用下面的代码来实现:

$("#sidebar.small").on({
    mouseenter: function () {
        alert(1);  //doesn't work
},
    mouseleave: function () {
        //stuff to do on mouse leave
    }
});

但这行不通。

我应该如何在更改后的 DOM 元素上执行悬停功能？

Answer 1

您应该能够使用 jquery 悬停方法来执行此操作:https://api.jquery.com/hover/

更新:抱歉注意到另一件事...当您最初设置事件处理程序时，#sidebar 是否具有 css 标记？按照您的代码编写方式，如果不存在，它将尝试附加到元素 $("#sidebar.small")，因此如果 css 标签不存在，它将不会附加到任何内容。

我想你想要更多这样的东西:

$("#sidebar").on({
    mouseenter: function() {
       if($('#sidebar').hasClass('small')) {
           alert(1);
       }
    }
});

再次更新错字，抱歉...