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 相关文章推荐
国外的为初学者写的JavaScript教程
Jun 09 Javascript
ie下jquery.getJSON的缓存问题的处理方法
Mar 29 Javascript
JS的数组迭代方法
Feb 05 Javascript
浅谈Javascript线程及定时机制
Jul 02 Javascript
AngularJS Module方法详解
Dec 08 Javascript
复杂的javascript窗口分帧解析
Feb 19 Javascript
jQuery实现获取table表格第一列值的方法
Mar 01 Javascript
node打造微信个人号机器人的方法示例
Apr 26 Javascript
webpack多入口多出口的实现方法
Aug 17 Javascript
vue项目前端错误收集之sentry教程详解
May 27 Javascript
轻松学习JavaScript函数中的 Rest 参数
May 30 Javascript
详解Javascript实践中的命令模式
May 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
虫族 Zerg 魔法科技
2020/03/14 星际争霸
smarty+adodb+部分自定义类的php开发模式
2006/12/31 PHP
解析获取优酷视频真实下载地址的PHP源代码
2013/06/26 PHP
php加密算法之实现可逆加密算法和解密分享
2014/01/21 PHP
PHP http请求超时问题解决方案
2020/11/13 PHP
javascript预加载图片、css、js的方法示例介绍
2013/10/14 Javascript
本人自用的global.js库源码分享
2015/02/28 Javascript
Ionic2系列之使用DeepLinker实现指定页面URL
2016/11/21 Javascript
完美解决jQuery 鼠标快速滑过后,会执行多次滑出的问题
2016/12/08 Javascript
vue vuex vue-rouert后台项目——权限路由(适合初学)
2017/12/29 Javascript
vue将对象新增的属性添加到检测序列的方法
2018/02/24 Javascript
JS实现快递单打印功能【推荐】
2018/06/21 Javascript
使用vue2实现带地区编号和名称的省市县三级联动效果
2018/11/05 Javascript
layui-table获得当前行的上/下一行数据的例子
2019/09/24 Javascript
vue实现移动端input上传视频、音频
2020/08/18 Javascript
[03:14]辉夜杯主赛事 12月25日每日之星
2015/12/26 DOTA
[00:32]2018DOTA2亚洲邀请赛EG出场
2018/04/03 DOTA
Python入门篇之面向对象
2014/10/20 Python
Python的randrange()方法使用教程
2015/05/15 Python
python对文件的操作方法汇总
2020/02/28 Python
win10安装python3.6的常见问题
2020/07/01 Python
Python实现PS滤镜中的USM锐化效果
2020/12/04 Python
Python3+SQLAlchemy+Sqlite3实现ORM教程
2021/02/16 Python
HTML5离线应用与客户端存储的实现
2018/05/03 HTML / CSS
营业员个人总结的自我评价
2013/10/25 职场文书
中专毕业生自我鉴定
2014/02/02 职场文书
《狼》教学反思
2014/03/02 职场文书
2014年两会学习心得体会
2014/03/10 职场文书
廉洁自律承诺书
2014/03/27 职场文书
幼儿园师德师风学习材料
2014/05/29 职场文书
2014年个人债务授权委托书范本
2014/09/22 职场文书
民事答辩状格式范文
2015/05/21 职场文书
网络妈妈观后感
2015/06/08 职场文书
女儿满月酒致辞
2015/07/29 职场文书
应届生们该怎么书写求职信?
2019/07/05 职场文书
SQL解决未能删除约束问题drop constraint
2022/05/30 SQL Server