jQuery的live()方法对hover事件的处理示例
作者:
一个模仿悬停事件的方法,当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数
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
待考证......
一个模仿悬停事件(鼠标移动到一个对象上面及移出这个对象)的方法
当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。
当鼠标移出这个元素时,会触发指定的第二个函数。
复制代码 代码如下:
$('.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
待考证......