jQuery 基础事件

一、绑定事件

jQuery通过.bind()方法来为元素绑定事件，可以传三个参数：bind(type,[data],fn)，type表示一个或多个类型的事件名字字符串；[data]是可选项，作为event.data属性值传递一个额外的数据，这个数据是一个字符串、一个数字、一个数组或一个对象；fn表示绑定到指定元素的处理函数。

//使用点击事件
$('input').bind('click', function () { //点击按钮后执行匿名函数
    alert('点击！');
});

//普通处理函数
$('input').bind('click', fn); //执行普通函数式无须圆括号
function fn() {
    alert('点击！');
}

//可以同时绑定多个事件
$('input').bind('mouseout mouseover', function () { //移入和移出分别执行一次
    $('div').html(function (index, value) {
        return value + '1';
    });
});

//通过对象键值对绑定多个参数
$('input').bind({  //传递一个对象
    'mouseout' : function () { //事件名的引号可以省略
        alert('移出');
    },
    'mouseover' : function () {
        alert('移入');
    }
});

//使用 unbind 删除绑定的事件
$('input').unbind(); //删除所有当前元素的所有事件

//使用 unbind 参数删除指定类型事件
$('input').unbind('click'); //删除当前元素的 click 事件

//使用 unbind 参数删除指定处理函数的事件
function fn1() {
    alert('点击 1');
}
function fn2() {
    alert('点击 2');
}
$('input').bind('click', fn1);
$('input').bind('click', fn2);
$('input').unbind('click', fn1); //只删除 fn1 处理函数的事件

二、简写事件

click(fn)　　　　 鼠标　　 触发每一个匹配元素的 click(单击)事件
dblclick(fn) 　　  鼠标 　　触发每一个匹配元素的 dblclick(双击)事件
mousedown(fn )  鼠标　　 触发每一个匹配元素的 mousedown(点击后)事件
mouseup(fn)　　鼠标 　　触发每一个匹配元素的 mouseup(点击弹起)事件
mouseover(fn)　 鼠标　　 触发每一个匹配元素的 mouseover(鼠标移入)事件
mouseout(fn) 　  鼠标 　　触发每一个匹配元素的 mouseout(鼠标移出)事件
mousemove(fn)   鼠标　　 触发每一个匹配元素的 mousemove(鼠标移动)事件
mouseenter(fn)    鼠标 　　触发每一个匹配元素的 mouseenter(鼠标穿过)事件
mouseleave(fn)    鼠标 　　触发每一个匹配元素的 mouseleave(鼠标穿出)事件
keydown(fn)　　 键盘 　　触发每一个匹配元素的 keydown(键盘按下)事件
keyup(fn) 　　     键盘　　 触发每一个匹配元素的 keyup(键盘按下弹起)事件
keypress(fn) 　　键盘　　 触发每一个匹配元素的 keypress(键盘按下)事件
unload(fn) 　　   文档　　 当卸载本页面时绑定一个要执行的函数
resize(fn) 　　    文档 　　触发每一个匹配元素的 resize(文档改变大小)事件
scroll(fn)　　      文档 　　触发每一个匹配元素的 scroll(滚动条拖动)事件
focus(fn)　　      表单 　　触发每一个匹配元素的 focus(焦点激活)事件
blur(fn) 　       　表单 　　触发每一个匹配元素的 blur(焦点丢失)事件
focusin(fn) 　 　表单　　 触发每一个匹配元素的 focusin(焦点激活)事件
focusout(fn) 　   表单　　 触发每一个匹配元素的 focusout(焦点丢失)事件
select(fn) 　  　  表单　　 触发每一个匹配元素的 select(文本选定)事件
change(fn) 　　 表单　　 触发每一个匹配元素的 change(值改变)事件
submit(fn) 　　  表单 　　触发每一个匹配元素的 submit(表单提交)事件

mouseover()和.mouseout()表示鼠标移入和移出的时候触发。.mouseenter()和.mouseleave()表示鼠标穿过和穿出的时候触发。

区别：.mouseenter()和.mouseleave()这组穿过子元素不会触发，而.mouseover()和.mouseout()则会触发。

.keydown()、.keyup()返回的是键码(keyCode)，而.keypress 返回的是字符编码(charCode)。

.focus()和.blur()分别表示光标激活和丢失，事件触发时机是当前元素。而.focusin()和.focusout()也表示光标激活和丢失，但事件触发时机可以是子元素。

三、复合事件

ready(fn)   　　　　　　当 DOM 加载完毕触发事件
hover([fn1,]fn2) 　　　　当鼠标移入触发第一个 fn1，移出触发 fn2
toggle(fn1,fn2[,fn3..])　   已废弃，当鼠标点击触发 fn1,再点击触发 fn2

.hover()方法是结合了.mouseenter()方法和.mouseleva()方法，并非.mouseover()和.mouseout()方法。