javascript - jquery mouseenter 和 mouseleve 不适用于新注入(inject)的 dom 元素

Question

我有以下代码。它工作正常，但是当我将新元素添加到 dom 中时，它不会显示或隐藏它。

jQuery("div.cat-icon").on({
       mouseenter: function () {
        jQuery(this).find('.catselect').show();
    },
    mouseleave: function () {
        jQuery(this).find('.catselect').hide();
    }
});

请指教。

Answer 1

动态添加的元素需要委托(delegate)事件处理程序:

jQuery(document).on({
    mouseenter: function () {
        jQuery(this).find('.catselect').show();
    },
    mouseleave: function () {
        jQuery(this).find('.catselect').hide();
    }
}, "div.cat-icon");