jQuery的live()方法对hover事件的处理示例


Posted in Javascript onFebruary 27, 2014

hover([over,]out)

一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法

当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。

当鼠标移出这个元素时,会触发指定的第二个函数。

$('.myDiv').hover(function() { 
doSomething... 
}, function() { 
doSomething... 
});

而问题是有些元素比如菜单是通过AJAX动态加载的,hover方法执行的时候

菜单还没加载出来呢,所以就要用到jquery的另一个方法live()

.live() 方法能对一个还没有添加进DOM的元素有效,是由于使用了事件委托:

绑定在祖先元素上的事件处理函数可以对在后代上触发的事件作出回应。

传递给 .live() 的事件处理函数不会绑定在元素上,

而是把他作为一个特殊的事件处理函数,绑定在 DOM 树的根节点上。

$('.myDiv').live('hover',function(event){ 
if(event.type=='mouseenter'){ 
doSomething... 
}else{ 
doSomething... 
} 
})

有的jquery版本响应的是mouseenter和mouseleave
有的是mouseover和mouseout
待考证......
Javascript 相关文章推荐
解决 firefox 不支持 document.all的方法
Mar 12 Javascript
一行代码实现纯数据json对象的深度克隆实现思路
Jan 09 Javascript
使用jQuery快速解决input中placeholder值在ie中无法支持的问题
Jan 02 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
Feb 13 Javascript
jquery实现兼容IE8的异步上传文件
Jun 15 Javascript
javascript实现九宫格相加数值相等
May 28 Javascript
如何使用Vuex+Vue.js构建单页应用
Oct 27 Javascript
前端js弹出框组件使用方法
Aug 24 Javascript
Vue.js基础知识小结
Jan 13 Javascript
Angular使用$http.jsonp发送跨站请求的方法
Mar 16 Javascript
基于vue2的canvas时钟倒计时组件步骤解析
Nov 05 Javascript
node.js使用yargs处理命令行参数操作示例
Feb 11 Javascript
类似天猫商品详情随浏览器移动的示例代码
Feb 27 #Javascript
css结合js制作下拉菜单示例代码
Feb 27 #Javascript
js function定义函数的几种不错方法
Feb 27 #Javascript
window.open 以post方式传递参数示例代码
Feb 27 #Javascript
jQuery之ajax删除详解
Feb 27 #Javascript
jQuery之字体大小的设置方法
Feb 27 #Javascript
jquery validate 自定义验证方法介绍 日期验证
Feb 27 #Javascript
You might like
二行代码解决全部网页木马
2008/03/28 Javascript
js post方式传递提交的实现代码
2010/05/31 Javascript
你必须知道的JavaScript 中字符串连接的性能的一些问题
2013/05/07 Javascript
当鼠标移动时出现特效的JQuery代码
2013/11/08 Javascript
jquery删除数据记录时的弹出提示效果
2014/05/06 Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
2015/03/03 Javascript
Backbone.js的Hello World程序实例
2015/06/19 Javascript
JS使用正则表达式过滤多个词语并替换为相同长度星号的方法
2016/08/03 Javascript
Vue2.0实现将页面中表格数据导出excel的实例
2017/08/09 Javascript
javascript+html5+css3自定义弹出窗口效果
2017/10/26 Javascript
jQuery实现input[type=file]多图预览上传删除等功能
2019/08/02 jQuery
手把手教你如何编译打包video.js
2020/12/09 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
[56:12]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第一场 6.3
2018/06/04 DOTA
Python中用max()方法求最大值的介绍
2015/05/15 Python
python中返回矩阵的行列方法
2018/04/04 Python
详解Python3.6的py文件打包生成exe
2018/07/13 Python
python3 unicode列表转换为中文的实例
2018/10/26 Python
python版本五子棋的实现代码
2018/12/11 Python
django中ORM模型常用的字段的使用方法
2019/03/05 Python
python中tkinter的应用:修改字体的实例讲解
2019/07/17 Python
python读取多层嵌套文件夹中的文件实例
2020/02/27 Python
django配置app中的静态文件步骤
2020/03/27 Python
pytorch 中的重要模块化接口nn.Module的使用
2020/04/02 Python
pandas的resample重采样的使用
2020/04/24 Python
Python读入mnist二进制图像文件并显示实例
2020/04/24 Python
Django模板报TemplateDoesNotExist异常(亲测可行)
2020/12/18 Python
HTML5应用之文件上传
2016/12/30 HTML / CSS
英格兰橄榄球商店:England Rugby Store
2016/12/17 全球购物
Dr.Jart+美国官网:韩国药妆品牌
2019/01/18 全球购物
家长建议怎么写
2014/05/15 职场文书
乡镇群众路线教育实践活动整改措施
2014/10/04 职场文书
民政局办理协议离婚(范本)
2014/10/25 职场文书
教师思想工作总结2015
2015/05/13 职场文书
刑事上诉状(量刑过重)
2015/05/23 职场文书
Laravel中获取IP的真实地理位置
2021/04/01 PHP