在 jQuery On 或 JavaScript 绑定中分配变量

Question

简短的问题，我怎样才能更有效地编写下面的代码，这样我就不会重复地给父变量分配一个新值？

此绑定函数是否与使用对象文本相同？

function bindAuthorPopup() {
        $(".insight-author").on({
            mouseenter: function (event) {
                var parent = $(this).parent('div').find('.popup-content');
                parent.toggleClass('show');
            },
            mouseleave: function (event) {
                var parent = $(this).parent('div').find('.popup-content');
                parent.toggleClass('show');
            },            
        });
    }

Answer 1

你可以做这样的事情：

function bindAuthorPopup() {
    $(".insight-author").each(function() {
        var elem = $(this);
        var parent = elem.parent('div').find('.popup-content');
        elem.on({
            mouseenter: function (event) {
                parent.toggleClass('show');
            },
            mouseleave: function (event) {
                parent.toggleClass('show');
            },
        });       
    });
}

即使回调不同，这也有效。如果它们总是相同的，那么你可以使用@sh1da9440写的内容。

Answer 2

可以将空格分隔的事件类型传递给"on"方法。

function bindAuthorPopup() {
    $(".insight-author").on('mouseenter mouseleave', function (event) {
        var parent = $(this).parent('div').find('.popup-content');
        parent.toggleClass('show');
    });
}