一、事件
1.1、绑定事件
bind()://为每个匹配元素的特定事件绑定事件处理函数。jQuery 3.0中已弃用此方法
on()//在选择元素上绑定一个或多个事件的事件处理函数。
one()//附加一个事件，只运行一次，然后删除自己
1.2、解除事件
unbind()//bind()的反向操作，从每一个匹配的元素中删除绑定的事件。jQuery 3.0中已弃用此方法，请用 off()代替。
off()//在选择元素上移除一个或多个事件的事件处理函数
1.3、简单事件
blur()//当元素失去焦点时触发 blur 事件
change()//当元素的值发生改变时，会发生 change 事件
click()//触发点击事件
dbclick()//双击元素时，会发生 dblclick 事件
focus()//当元素获得焦点时，触发 focus 事件。
$(window).scroll()//当浏览器窗口滚动时，会发生 scroll 事件。
$(window).unload()//在当用户离开页面时，会发生 unload 事件。
1.4、复合事件
hover(fn1,fn2):鼠标移入，触发fn1;鼠标移出触发fn2
//例：
$("#div").hover(
function(){
$(this).css("background", '#bbffaa');
},
function(){
$(this).css("background", 'red');
});
二、事件对象
2.1、事件对象的获取
在事件触发的函数中传递event参数
2.2、事件对象的常用属性
event.type 事件类型
event.target 触发事件的元素
//target:当前点击的标签
event.currentTarget 事件绑定在哪个元素上
//currentTarget:保存的是事件绑定的对象
event.pageX:相对于文档的左侧
event.pageY 相对于文档的顶部
2.3、事件的冒泡以及默认行为的处理
事件冒泡：点击某个节点后，如果该节点的父节点也有点击事件，则父节点的点击事件也会被触发
阻止冒泡：event.stopPropagation()
默认行为：一些标签在点击后会有自己的行为，如a标签点击后会自动跳转到指定的链接中
阻止默认行为触发:event.preventDefault()
三、高级事件
3.1、事件模拟操作(模拟用户触发了某个事件)
element.trigger("")
$(document).ready(function(){
$('div').click(function(){
alert('888888888');
});
//链式语法 很强势
$('div').click(function(){
alert('888888888');
}).click();
//事件模拟 不通过用户触发事件 让事件自己触发起来
$('div').trigger('click');
$('div').triggerHandle('click');
})
3.2、命名空间
给事件名添加一个新的名字，使用点分割。移除事件，可以通过新添加进去的名字来移除
$(function(){
//命名空间：我们可以在事件名后给它添加一个新的名字，使用点分割。这样就通过后缀把相同事件添加的不同方法区分开，方便了事件管理
$('div').on('click.tel',function(){
alert('包小姐：138****8181');
})
$('div').on('click',function(){
$(this).css("background","red");
})
$('div').off('click.tel');
})
3.3、事件委托
事件自身不处理事件，把处理任务委托给父元素，甚至根元素(document)
/*$(document).ready(function(){
$('ul').on("click",function(e){
alert("触发该事件的是!!!"+e.target.textContent);
alert("事件绑定在哪个元素上"+e.currentTarget.textContent);
})
})*/
//事件委托
$(document).ready(function(){
$('ul').on("click","li",function(e){
alert("触发该事件的是!!!"+e.target.textContent);
alert("事件绑定在哪个元素上"+e.currentTarget.textContent);
})；
})
四、自定义事件编写
自己定义一个事件名，并给这个事件名添加一个函数。
最后使用element.trigger()来执行自定义的事件
$(function(){
//自定义事件不指望引擎触发
//链式语法不能执行
//只能通过trigger/triggerHandler相关语法去调用
$('div').on('helloworld',function(){
alert('23');
})
$('div').triggerHandler('helloworld');
})
