Question

jQuery文档显示以下内容：

$( "div.test" ).on({
  click: function() {
    $( this ).toggleClass( "active" );
  }, mouseenter: function() {
    $( this ).addClass( "inside" );
  }, mouseleave: function() {
    $( this ).removeClass( "inside" );
  }
});

我们可以将一个对象传递给.on()函数，以便它根据对象确定它将做什么。

但如果我想要相当于

，该怎么办？

$('div.test').on('click', 'a.button', function(){foo();}

IE我希望使用此处顶部列出的对象样式监控div.test上click，mousenter和mouseleave个事件的a.button < / p>

Answer 1

根据jQuery's source of fn.on

if (typeof types === "object") {
    // ( types-Object, selector, data )
    if (typeof selector !== "string") {
        // ( types-Object, data )
        data = data || selector;
        selector = undefined;
    }
    for (type in types) {
        this.on(type, selector, data, types[type], one);
    }
    return this;
}

如果传入一个对象，它将检查selector是否是一个刺痛。如果是，那么它将不管它。接下来，它将迭代该对象，再次执行每个on。

所以你的代码是：

$( "div.test" ).on({
  click: function() {
    $( this ).toggleClass( "active" );
  }, mouseenter: function() {
    $( this ).addClass( "inside" );
  }, mouseleave: function() {
    $( this ).removeClass( "inside" );
  }
}, 'a.button');

DEMO

如何在传入对象时使用$ .on（）来调整事件的范围

1 个答案: