事件处理订单

Question

javascript jquery事件处理 if on event（例如'click'）为父元素绑定一个函数，为子DOM元素绑定另一个处理函数，调用哪些函数？ 如果他们所有人都会按照哪个顺序打电话？ 谢谢！

Answer 1

事件冒泡“向上”DOM树，所以如果你有一个元素及其父元素的处理程序，那么将首先调用子元素处理程序。

如果在单个DOM元素上为一个事件注册多个处理程序（例如，单个按钮的多个“click”处理程序），则按照它们附加到元素的顺序调用处理程序。

您的处理程序可以做一些事情来改变它们完成后发生的事情：

• 使用传入的事件参数，调用event.preventDefault()以防止任何“原生”操作发生
• 调用event.stopPropagation()以阻止事件冒泡DOM树
• 从处理程序返回false，停止传播和阻止默认

请注意，对于某些输入元素（复选框，单选按钮），处理有点奇怪。当您的处理程序被调用时，浏览器已经将复选框“已检查”设置为与其原值相反的值。也就是说，如果你有一个未选中的复选框，那么“click”处理程序会注意到“checked”属性在被调用时（在用户点击之后）将被设置为“true”。但是，如果处理程序返回false，则实际上不会通过单击更改复选框值，并且它将保持未选中状态。所以它就像浏览器在调用处理程序之前执行了一半“本机”操作（切换元素“checked”属性），但是如果处理程序没有返回false，那么只有真正更新元素（或者在事件对象上调用“preventDefault（）”。

Answer 2

首先调用孩子，然后调用父母。

当事件冒泡时，事件从孩子转到父母。在同一个元素上，处理程序将按它们绑定的顺序执行。