jquery中trigger()无法触发hover事件的解决方法


Posted in Javascript onMay 07, 2015

今天做一个项目,遇到了一个问题,是以前没有遇到过的,就此记上一笔。

1、trigger方法解释

官方是这么解释的:

Description: Execute all handlers and behaviors attached to the matched elements for the given event type.

用法:
.trigger( eventType [, extraParameters] )

其中eventType包含javascript内置的事件、jQuery增加的事件和自定义事件。例如:

$('#foo').bind('click', function()
{
 alert($(this).text());
});
$('#foo').trigger('click');
$('#foo').bind('custom', function(event, param1, param2)
{
 alert(param1 + "\n" + param2);
});
$('#foo').trigger('custom', ['Custom', 'Event']);

很强大,常常用于页面初始化的时候使用。

2、trigger遇到hover

var $search=$('#header .search');
$search.find('li').hover(function()
{
 alert(1);
},function()
{
 alert(2);
});
$search.find('li').eq(0).trigger('hover');

无法触发hover。但是:

var $search=$('#header .search');
$search.find('li').click(function()
{
 alert(1);
},function()
{
 alert(2);
});
$search.find('li').eq(0).trigger('click');

触发click正常!

解决办法:

var $search=$('#header .search');
$search.find('li').hover(function()
{
 alert(1);
},function()
{
 alert(2);
});
$search.find('li').eq(0).trigger('mouseenter');//hover修改为mouseenter/mouseleave/mouseover/mouseout

同样的情况存在于jQuery.live(),不过live不推荐在1.7以后版本使用,使用on()代替。

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
Js sort排序使用方法
Oct 17 Javascript
JavaScript Memoization 让函数也有记忆功能
Oct 27 Javascript
基于JQuery实现的Select级联
Jan 27 Javascript
jquery制作select列表双向选择示例代码
Sep 02 Javascript
JavaScript模版引擎的基本实现方法浅析
Feb 15 Javascript
浅析jQuery操作select控件的取值和设值
Dec 07 Javascript
AngularJS通过ng-route实现基本的路由功能实例详解
Dec 13 Javascript
bootstrap IE8 兼容性处理
Mar 22 Javascript
bootstrap+jQuery实现的动态进度条功能示例
May 25 jQuery
详解如何让InstantClick兼容MathJax、百度统计等
Sep 12 Javascript
如何将HTML字符转换为DOM节点并动态添加到文档中详解
Aug 19 Javascript
layui的面包屑或者表单不显示的解决方法
Sep 05 Javascript
javascript实现的图片切割多块效果实例
May 07 #Javascript
javascript中indexOf技术详解
May 07 #Javascript
javascript限制文本框输入值类型的方法
May 07 #Javascript
浅谈Javascript的静态属性和原型属性
May 07 #Javascript
ECMAScript5(ES5)中bind方法使用小结
May 07 #Javascript
JS中获取函数调用链所有参数的方法
May 07 #Javascript
jQuery中animate动画第二次点击事件没反应
May 07 #Javascript
You might like
PHP5.3新特性小结
2016/02/14 PHP
PHP数据库操作三:redis用法分析
2017/08/16 PHP
帮助避免错误的Javascript陷阱清单
2009/05/31 Javascript
JavaScript Timer实现代码
2010/02/17 Javascript
js实现字符串和数组之间相互转换操作
2016/01/12 Javascript
jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】
2016/08/01 Javascript
jQuery实现单击按钮遮罩弹出对话框效果(1)
2017/02/20 Javascript
Vue2.0基于vue-cli+webpack同级组件之间的通信教程(推荐)
2017/09/14 Javascript
vue2.0使用v-for循环制作多级嵌套菜单栏
2018/06/25 Javascript
jQuery实现动画、消失、显现、渐出、渐入效果示例
2018/09/06 jQuery
基于JavaScript获取base64图片大小
2019/10/18 Javascript
微信小程序自定义navigationBar顶部导航栏适配所有机型(附完整案例)
2020/04/26 Javascript
JavaScript图像放大镜效果实现方法详解
2020/06/28 Javascript
[38:31]完美世界DOTA2联赛PWL S3 Magma vs GXR 第一场 12.13
2020/12/17 DOTA
python实现在windows服务中新建进程的方法
2015/06/30 Python
python制作最美应用的爬虫
2015/10/28 Python
Python中使用OpenCV库来进行简单的气象学遥感影像计算
2016/02/19 Python
python中文乱码不着急,先看懂字节和字符
2017/12/20 Python
mvc框架打造笔记之wsgi协议的优缺点以及接口实现
2018/08/01 Python
python tkinter库实现气泡屏保和锁屏
2019/07/29 Python
使用Python进行防病毒免杀解析
2019/12/13 Python
Django模板标签{% for %}循环,获取制定条数据实例
2020/05/14 Python
解决Pyinstaller打包软件失败的一个坑
2021/03/04 Python
wedgwood加拿大官网:1759年成立的英国国宝级陶瓷餐具品牌
2018/07/17 全球购物
ORACLE十问
2015/04/20 面试题
机电一体化自荐信
2013/12/10 职场文书
劳资人员岗位职责
2013/12/19 职场文书
大学生毕业的自我评价分享
2014/01/02 职场文书
《商鞅南门立木》教学反思
2014/02/16 职场文书
社区戒毒工作方案
2014/06/04 职场文书
小学社会实践活动总结
2014/07/03 职场文书
幼儿园教师考核评语
2014/12/31 职场文书
销售员自我评价
2015/03/11 职场文书
2015年学校信息技术工作总结
2015/05/25 职场文书
《比尾巴》教学反思
2016/02/24 职场文书
Python中os模块的简单使用及重命名操作
2021/04/17 Python