JQuery中的常用事件、对象属性与使用方法分析
本文实例讲述了JQuery中的常用事件、对象属性与使用方法。分享给大家供大家参考，具体如下：
JQuery中的常用事件
.click() 鼠标单击触发事件，参数可选（data，function） .dblclick() 双击触发，同上 .mousedown()/up() 鼠标按下/弹起触发事件 .mousemove() 鼠标移动事件 .mouseover()/out() 鼠标移入/移出触发事件 .mouseenter()/leave() 鼠标进入/离开触发事件* .hover(func1,func2) 鼠标移入调用func1函数，移出调用func2函数 .focusin() 鼠标聚焦到该元素时触发事件 .focusout() 鼠标失去焦点时触发事件 .focus()/.blur() 鼠标聚焦/失去焦点触发事件（不支持冒泡） .change() 表单元素发生改变时触发事件 .select() 文本元素被选中时触发事件 .submit() 表单提交动作触发* .keydown()/up() 键盘按键按下/弹起触发 .on() 多事件的绑定 .off() 移除事件的绑定 .trigger(“event”) 触发事件event调用 .triggerHandler() 触发事件，不会冒泡，不会触发默认事件
注：
1、以上事件函数有三种用法：
//直接绑定事件到元素上
$('.target1').keydown(function(e){
$("em:first").text(e.target.value)//通过对象e获取输入的值
});
//传递参数调用函数处理
$("#test").click(11111,function(e){
//this指向div元素
//e.data=>11111通过e传递参数数据
});
//手动触发已绑定的点击事件 $elem.click()
2、mouseover与mouseenter区别：不论鼠标指针穿过被选元素或其子元素，都会触发mouseover事件，称作支持冒泡处理，冒泡处理指子元素与父元素共同定义的事件，在触发子元素时，或者没有定义子元素，事件就会向父级传播，引发父级事件触发。只有在鼠标指针穿过被选元素时，才会触发mouseenter事件。
3、form元素是有默认提交表单的行为，如果通过submit处理的话，需要禁止浏览器的这个默认行为。传统的方式是调用事件对象 e.preventDefault()来处理，jQuery中可以直接在函数中最后结尾returnfalse即可。
//回车键或者点击提交表单后禁止浏览器默认跳转：
$('#target2').submit(function(){
alert('捕获提交表达动作,阻止页面跳转')
returnfalse;
});
4、on()使用
基本用法：.on(events,[selector],[data])
最常见的给元素绑定一个点击事件，对比一下快捷方式与on方式的不同
$("#elem").click(function(){})//快捷方式
$("#elem").on('click',function(){})//on方式
//多个事件绑定同一个函数，通过空格分离，传递不同的事件名，可以同时绑定多个事件
$("#elem").on("mouseovermouseout",function(){});
//多个事件绑定不同函数
$("#elem").on({
mouseover:function(){},
mouseout:function(){}
});
//将数据传递到处理程序
$("button").on("click",{//第二个参数传递数据给函数调用
name:"Mr.Tory"
},greet);
functiongreet(event){
alert("Hello"+event.data.name);//输出HelloMr.Tory
}
事件对象的属性与方法
.type 事件类型.如果使用一个事件处理函数来处理多个事件,可以使用此属性获得事件类型,比如click .data 事件调用时传入额外参数 .target 触发该事件的DOM元素 .which 指示按了哪个键或按钮 .timeStamp 该属性返回从1970年1月1日到事件发生时的毫秒数 .pageX/Y 相对于文档左/上边缘的鼠标位置 .result 上一个相同事件处理器函数返回的值 .preventDefalut() 阻止事件的默认动作 .stopPropagation() 取消事件冒泡
$("#content").click(function(event){
$("#msg").html("外层div元素被单击
");
event.stopPropagation();//通过event方法阻止事件冒泡
});
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常见事件用法与技巧总结》、《jQuery常用插件及用法总结》、《jQuery操作json数据技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。