jQuery 事件对象属性小结

在jQuery中，事件处理函数的第一个参数永远是事件对象（Event Object），也就是包含了当前事件的相关信息的对象。事件对象可以提供给我们许多有用的信息，帮助我们更好地理解和处理当前事件。

事件对象属性

1. type属性

事件类型，是一个字符串，比如“click”，“mousemove”等。

2. target属性

事件目标对象，也就是触发当前事件的DOM元素。

3. currentTarget属性

事件当前处理对象，也就是绑定当前事件的DOM元素。

4. preventDefault()方法

阻止默认事件发生，比如链接点击跳转，表单提交等。

5. stopPropagation()方法

阻止事件冒泡，即事件不会向父元素传递。

示例说明

示例1：禁用链接跳转

<a href="http://example.com" id="link">点击我跳转</a>

$('#link').on('click', function(event) {
    event.preventDefault(); // 禁用链接默认跳转
    console.log('链接被点击！');
});

示例2：阻止事件冒泡

<div id="outer">
    <div id="inner">点我触发事件冒泡</div>
</div>

$('#outer').on('click', function(event) {
    console.log('外层div被点击！');
});

$('#inner').on('click', function(event) {
    event.stopPropagation(); // 阻止事件冒泡
    console.log('内层div被点击！');
});

以上两个示例分别演示了阻止链接跳转和阻止事件冒泡两个常见的应用场景。通过使用事件对象提供的属性和方法，我们可以更加灵活地处理各种事件，并且提升网站的交互体验。