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 相关文章推荐
jQuery使用手册之三 CSS操作
Mar 24 Javascript
jquery根据name属性查找的小例子
Nov 21 Javascript
js中Math之random,round,ceil,floor的用法总结
Dec 26 Javascript
JS通过分析userAgent属性来判断浏览器的类型及版本
Mar 28 Javascript
JavaScript中SetInterval与setTimeout的用法详解
Nov 10 Javascript
详解JavaScript函数
Dec 01 Javascript
JQuery之proxy实现绑定代理方法
Aug 01 Javascript
浅谈vue的props,data,computed变化对组件更新的影响
Jan 16 Javascript
vue router的基本使用和配置教程
Nov 05 Javascript
Node.js assert断言原理与用法分析
Jan 04 Javascript
微信小程序事件 bindtap bindinput代码实例
Aug 26 Javascript
详解JavaScript 异步编程
Jul 13 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
基于mysql的bbs设计(五)
2006/10/09 PHP
解析PHP SPL标准库的用法(遍历目录,查找固定条件的文件)
2013/06/18 PHP
下拉列表多级联动dropDownList示例代码
2013/06/27 PHP
ThinkPHP的常用配置选项汇总
2016/03/24 PHP
基于php(Thinkphp)+jquery 实现ajax多选反选不选删除数据功能
2017/02/24 PHP
PHP与JavaScript针对Cookie的读写、交互操作方法详解
2017/08/07 PHP
gearman中任务的优先级和返回状态实例分析
2020/02/27 PHP
国外Lightbox v2.03.3 最新版 下载
2007/10/17 Javascript
jquery dialog键盘事件代码
2010/08/01 Javascript
js去除输入框中所有的空格和禁止输入空格的方法
2014/06/09 Javascript
JS实现表格数据各种搜索功能的方法
2015/03/03 Javascript
jQuery实现网站添加高亮突出显示效果的方法
2015/06/26 Javascript
js实现基于正则表达式的轻量提示插件
2015/08/29 Javascript
chrome浏览器当表单自动填充时如何去除浏览器自动添加的默认样式
2015/10/09 Javascript
最简单纯JavaScript实现Tab标签页切换的方式(推荐)
2016/07/25 Javascript
JSON与String互转的实现方法(Javascript)
2016/09/27 Javascript
JS实现简单的星期格式转换功能示例
2018/07/23 Javascript
layui table复选框禁止某几条勾选的实例
2019/09/20 Javascript
vue实现表格过滤功能
2019/09/27 Javascript
Vue的Options用法说明
2020/08/14 Javascript
[01:05:36]VP vs TNC Supermajor小组赛B组 BO3 第二场 6.2
2018/06/03 DOTA
Python文件与文件夹常见基本操作总结
2016/09/19 Python
python使用PyQt5的简单方法
2019/02/27 Python
python实现按首字母分类查找功能
2019/10/31 Python
对Tensorflow中tensorboard日志的生成与显示详解
2020/02/04 Python
python sitk.show()与imageJ结合使用常见的问题
2020/04/20 Python
django和flask哪个值得研究学习
2020/07/31 Python
手工制作的意大利太阳镜和光学元件:Illesteva
2019/01/19 全球购物
教师学习培训邀请函
2014/02/04 职场文书
企业文化标语大全
2014/06/10 职场文书
国家机关领导干部民主生活会对照检查材料思想汇报
2014/09/17 职场文书
领导班子奢靡之风查摆问题及整改措施
2014/09/27 职场文书
公司向个人借款协议书范本
2014/10/09 职场文书
2016年寒假社会实践活动总结
2015/10/10 职场文书
浅谈Python协程asyncio
2021/06/20 Python
vue中控制mock在开发环境使用,在生产环境禁用方式
2022/04/06 Vue.js