Question

这就是我所拥有的

$('.test').on({
    'click', 'a', function(event) {
        event.stopPropagation();

        if( $(this).hasClass('selector') ) {
        }
        if( $(this).hasClass('prev') ) {
        }
        if( $(this).hasClass('next') ) {
        }
        return false;
    },
    mouseenter: function(){
    },
    mouseleave: function(){
    }
});

我知道这是错误的语法，那么正确的语法是什么？我知道如果我将点击和鼠标事件分开，我可以写它。但有没有办法将它们结合起来，还是我需要将它们分开？谢谢你的时间

Answer 1

你可以链接电话：

$('.test').on('click', 'a', function() { ... })
 .on('mouseenter', 'a', function() { ... })
 .on('mouseleave', 'a', function() { ... });

我想如果你想要你可以有一个检查事件类型的处理程序，但这看起来不那么奇怪。

Answer 2

如果您不希望在两者中使用相同的选择器，则必须进行2次单独调用：

$('.test').on({
    mouseenter: function() {},
    mouseleave: function() {} //null selector/no selector here so these events only fire on `.test` itself
}).on("click", "a", function(event) { //Selector here so this event only fires for `a` descendants of `.test`
    event.stopPropagation();
    if ($(this).hasClass('selector')) {}
    if ($(this).hasClass('prev')) {}
    if ($(this).hasClass('next')) {}
    return false;
});

您也忘了指定事件参数，这会导致IE和Firefox中的错误

Answer 3

.on()也接受地图：

$('.test').on({
    click: function() {
    },
    mouseenter: function() {
    },
    mouseleave: function() {
    }
}, 'a');

Answer 4

如果您只需要包装元素上的悬停事件，那么您需要单独绑定它的事件，因为它是一个单独的元素。

$('.test').on({
    click: function(event) {
        event.stopPropagation();
        if ($(this).hasClass('selector')) {}
        if ($(this).hasClass('prev')) {}
        if ($(this).hasClass('next')) {}
        return false;
    }
}, "a");

$('.test').hover( function(event){
        // This in the mouse enter handler  
    },
    function(event){
        // This is the mouse leave handler
    }
);

如何以正确的方式在（）上编写这个jquery？

4 个答案: