jquery hover(overListener, outListener) || bind('mouseover',methodA).bind('mouseout',methodB)
2016-02-23 10:47
477 查看
1.区别：
bind方式，进入外部区域和内部区域都会触发相关方法（methodA 或methodB）；
hover方式，进入内部区域不会再触发相关方法。
2.example：
<body>
<div class="outer" id="outer1">
Outer 1
<div class="inner" id="inner1">Inner 1</div>
</div>
<div class="outer" id="outer2">
Outer 2
<div class="inner" id="inner2">Inner 2</div>
</div>
<div id="console"></div>
<script type="text/javascript">
function report(event) {
$('#console').append('<div>'+event.type+'</div>');
}
$(function(){
$('#outer1')
.bind('mouseover',report)
.bind('mouseout',report);
$('#outer2').hover(report,report);
});
</script>
</body>
bind方式，进入外部区域和内部区域都会触发相关方法（methodA 或methodB）；
hover方式，进入内部区域不会再触发相关方法。
2.example：
<body>
<div class="outer" id="outer1">
Outer 1
<div class="inner" id="inner1">Inner 1</div>
</div>
<div class="outer" id="outer2">
Outer 2
<div class="inner" id="inner2">Inner 2</div>
</div>
<div id="console"></div>
<script type="text/javascript">
function report(event) {
$('#console').append('<div>'+event.type+'</div>');
}
$(function(){
$('#outer1')
.bind('mouseover',report)
.bind('mouseout',report);
$('#outer2').hover(report,report);
});
</script>
</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- jQuery监听文本框值改变触发事件（propertychange）
- Mootools遮罩层练习(原为网上的jquery写法)
- jQuery.Validate验证库
- JQuery给动态加载的节点绑定有效事件
- jQuery 操作导航栏
- jquery toggle(listenerOdd, listenerEven)
- jQuery常用知识点总结以及平时封装常用函数
- ajaxfileupload.js jQuery.handleError is not a function
- popup_layer jquery 弹出层使用，说明，详解
- JQuery在iframe中实现 点击后选中当前栏目的样式
- jQuery拖拽排序插件制作拖拽排序效果(附源码下载)
- jquery.cookie中的操作
- jquery如何删除一个元素后面的所有元素
- jQuery.Flot开发手记
- jquery动态改变form属性提交表单
- jQuery常用知识点总结以及平时封装常用函数
- JQUERY的AJAX请求缓存里的数据问题处理
- 教你如何终止JQUERY的$.AJAX请求
- 如何使用PHP+jQuery+MySQL实现异步加载ECharts地图数据(附源码下载)
- jQuery实现返回顶部功能