javascript - jQuery.on() 自己和孩子

Question

如果没有提供选择器，则 jQuery 中的.on()方法将匹配匹配的元素，或者如果有选择器，则仅匹配它的子元素。

是否可以将这两种行为结合起来以得到一个匹配元素和任何指定子元素的单个 .on() 语句？

示例：http: //jsfiddle.net/mwvdlee/YFF2k/

Answer 1

您可以简单地将事件处理程序绑定到父级并使用event.target ^[docs]来获取事件的实际目标元素：

$('.foo').on('click', function(event) {
    console.log('click', event.target);
});

由于事件冒泡（这就是事件委托最初的工作方式），每次点击 的后代.foo都会触发 的事件处理程序.foo（当然，除非事件以某种方式停止）。

Answer 2

您可以尝试以下方法：

$('.foo').children().andSelf().on('click', function (event){
  //something
});

Answer 3

默认情况下，事件正在冒泡。只需避免传递委托selector并将事件处理程序附加到父级。当孩子被点击时，事件应该冒泡到父母并且事件将被触发。

演示：http: //jsfiddle.net/YFF2k/2/

$('.foo').on('click', function (e) {
    console.log('click', e.target);
});