jQuery事件-委托机制、事件对象

委托机制

• 语法：.on( events ,[ selector ] ,[ data ], handler(eventObject) )
• 原理：如果提供了第二参数，那么事件在往上冒泡的过程中遇到了选择器匹配的元素，将会触发事件回调函数，否则，如果遇不到选择器匹配的元素，将不会触发事件回调函数
• 有选择器参数，回调函数中的this指向选择器选定的对象，而不是on前面的对象

---

事件对象

• 原理：是用来记录一些事件发生时的相关信息的对象。事件对象只有事件发生时才会产生，并且只能是事件处理函数内部访问，在所有事件处理函数运行结束后，事件对象就被销毁。

• ul有多个子元素li，如果我要响应每一个li的事件，那么常规的方法就是需要给所有的li都单独绑定一个事件监听，这样写法很符合逻辑，但是同时有显得繁琐。因为li都有一个共同的父元素，而且所有的事件都是一致的，这里我们可以采用要一个技巧来处理，也是常说的"事件委托"
• jQuery事件对象的属性：
  • event.target：代表当前触发事件的元素，可以通过当前元素对象的一系列属性来判断是不是我们想要的元素。event.target 和 this 通常用来确定事件是不是由于冒泡而触发的。结合上面的例子，event.target 是 li，this 是 ul
  • event.type：获取事件的类型，结合上面的例子，得出 click
  • event.pageX 和 event.pageY：获取鼠标当前相对于页面的坐标，以页面为参考点,不随滑动条移动而变化
  • event.currentTarget : 在事件冒泡过程中的当前DOM元素，等同于this
  • event.which：获取按下的键盘按键Unicode值，event.which 将 event.keyCode 和 event.charCode 标准化了。

• jQuery事件对象的方法：
  • event.preventDefault() 方法：阻止默认行为。这个用的特别多，在执行这个方法后，如果点击一个链接（a标签），浏览器不会跳转到新的 URL 去了。我们可以用 event.isDefaultPrevented() 来确定这个方法是否(在那个事件对象上)被调用过了
  • event.stopPropagation() 方法：阻止事件冒泡。为防止事件冒泡到DOM树上，也就是不触发的任何前辈元素上的事件处理函数