鼠标事件
键盘事件
其他事件
事件参数
事件绑定与取消
含fn参数说明有回调函数在里面
鼠标事件-click、dblclick
click:鼠标单击时触发；dblclick:鼠标双击时触发
例如：
$("div").click(function(){
$(this).css("text-indent","0")//点击后首行缩进为0
})
- 鼠标双击时会触发单击事件，如果要区别开来需要阻止事件冒泡
鼠标事件-mousedown、mouseup
mousedown：鼠标按下时触发
mouseup：鼠标松开时触发
例如：
$('div').mousedown(function(){
$(this).css('background-color','red'); //鼠标按下时背景变红
})
$('div').mouseup(function(){
$(this).css('background-color','yellow'); //鼠标按下时背景变黄
})
鼠标事件-mouseenter、mouseleave
鼠标进入、移出时触发
例如：
$('li').mouseenter(function(){
$(this).css('font-size','40px').css('color','red');//鼠标移入时修改字体大小和颜色
})
$('li').mouseleave(function(){
$(this).css('font-size','medium').css('color','black');//鼠标移出时修改字体大小和颜色
})
鼠标事件-hover
hover([over],out)
将鼠标进入、移出时触发整合成一个函数
$('li').hover(function()
{
$(this).css('font-size','40px').css('color','red');//鼠标移入时修改字体大小和颜色
},function()
{
$(this).css('font-size','medium').css('color','black');//鼠标移出时修改字体大小和颜色
})
鼠标事件-mouseover、mouseout
鼠标进入（移出）指定元素及其子元素时触发
- 由于每个子元素都会触发事件，不利于事件冒泡和捕获，因此不建议使用
鼠标事件-mousemove
mousemove([[data],fn])
在DOM内部移动时会发生mousemove事件
鼠标事件-scroll
scroll([[data,fn])
当滚动指定元素时，会发生scroll事件
- 不一定是通过滚轮，拖动滚动条也可以
键盘事件
- 按下键盘会触发键盘事件，顺序依次为：keydown->keypress->keyup
keydown、keypress事件触发在文字还没嵌入到文本框（只是按下字符键，显示的结果）
keydown([[data],fn])
当键盘或按钮被按下时，发生keydown事件
- 必须要在能获取焦点的地方才能发生事件
- 在输入法中输入的会有process值
keyup([[data],fn])
当键盘或按钮松开时，发生keydown事件，发生在当前获得焦点（光标）的元素上
例如：
$('input').keyup(function(){
$('p').text($(this).val()); //在p标签上实时获取输入值
})
- 必须要在能获取焦点的地方才能发生事件
- 在输入法中输入的会有process值
keypress([[data],fn])
当键盘或按钮被按下时，发生keypress事件
- 旧版键盘事件，但还是被保留下来了，只有输入内容的时候才响应，ctrl、shift还有输入法等输入不响应，因为没有输入内容
其他事件
其它事件-ready、resize
read(fn)
当DOM载入就绪可以查询及操纵时绑定一个要执行的函数
resize([[data],fn])
当调整浏览器窗口的大小时，发生resize事件
- 注意是窗口大小，并不是文档大小，可以使用window
其它事件-focus、blur
focus([[data],fn])、blur([[data,fn])
当元帅获得（失去）焦点时触发focus(blus)事件
例如判断输入框是否有内容，并改变边框颜色和提示信息：
$('input').focus(function(){
$('span').text('请输入用户名');//获取焦点后提示
})
$('input').blur(function(){
if($(this).val() == ''){ //失去焦点后判断
$(this).css({'border':'2px solid red'});
$('span').text('用户名不能为空')
}
else{
$(this).css({'border':'2px solid green'});
$('span').text('');
}
})
其它事件-change
change([[data],fn])
当元素的值发生改变时，会发生change事件
- 非实时，只有value改变的时候才会发生
4-5 其它事件-select
select([[data],fn])
textarea或者文本类型的input中的文本被选中时触发，可选中并且还能编辑才有效
其它事件-submit
submit([[data],fn])
提交表单时会发生submit事件
- button 在form中时 在除了IE的其他内核浏览器中 作为submit存在
- submit事件的用途
提交表单
阻止表单提交
表单验证
submit()是表单 要提交时 所触发的事件(所以要放在点击事件中)
所以在submit 的回调函数中 放入验证时所需要进行的操作
return false时 表单不会被提交
事件参数event
- 所有事件都会传递一个event参数
事件绑定与取消-on
on(events,[selector].[data].fn)
在选择的元素上绑定一个或者多个事件的事件处理函数
可以参考以下格式：
$(document).on('事件类型; '绑定的元素',fn);
同时绑定多个事件$(document).on({
'事件类型': fn
},{
'事件类型': fn
});
- [selector]是可以动态生成的
- 通过{}绑定多个事件
事件绑定与取消-off
off(events,[selector].[data].fn)
在选择的元素上移除一个或者多个事件的事件处理函数
- jQuery中提供了四种事件监听方式，分别是bind、live、delegate、on，对应的解除监听的函数分别是unbind、die、undelegate、off （面试竟然问事件绑定有多少种
- 每个绑定都要对应一个解绑，代码有点冗余
- document不是一个普通的对象，必须用add()来选择
事件绑定与取消-one
one(type.[data].fn)
为每一个匹配元素的特定事件（比如说click）绑定一个一次性的事件处理函数
- 绑定一次就会自动移除
