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定义对象或数组直接量时各浏览器对多余逗号的处理(json)
Mar 05 Javascript
鼠标滑上去后图片放大浮出效果的js代码
May 28 Javascript
基于jquery的web页面日期格式化插件
Nov 15 Javascript
JavaScript Scoping and Hoisting 翻译
Jul 03 Javascript
ajax异步刷新实现更新数据库
Dec 03 Javascript
JS动画效果打开、关闭层的实现方法
May 09 Javascript
Radio 单选JS动态添加的选项onchange事件无效的解决方法
Dec 12 Javascript
AngularJs篇:使用AngularJs打造一个简易权限系统的实现代码
Dec 26 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
js的新生代垃圾回收知识点总结
Aug 22 Javascript
vue同个按钮控制展开和折叠同个事件操作
Jul 29 Javascript
JS如何调用WebAssembly编译出来的.wasm文件
Nov 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
php strtotime 函数UNIX时间戳
2009/01/14 PHP
php中cookie实现二级域名可访问操作的方法
2014/11/11 PHP
jquery 添加节点的几种方法介绍
2013/09/04 Javascript
js处理json以及字符串的比较等常用操作
2013/09/08 Javascript
优化Jquery,提升网页加载速度
2013/11/14 Javascript
js获取url参数代码实例分享(JS操作URL)
2013/12/13 Javascript
JavaScript获取一个范围内日期的方法
2015/04/24 Javascript
jQuery on()方法绑定动态元素的点击事件实例代码浅析
2016/06/16 Javascript
JQuery控制DIV的选取实现方法
2016/09/18 Javascript
localStorage实现便签小程序
2016/11/28 Javascript
js实现移动端轮播图效果
2020/12/09 Javascript
解决使用bootstrap的dropdown部件时报错:error:Bootstrap dropdown require Popper.js问题
2018/08/30 Javascript
浅谈微信页面入口文件被缓存解决方案
2018/09/29 Javascript
微信小程序使用setData修改数组中单个对象的方法分析
2018/12/30 Javascript
微信小程序上线发布流程图文详解
2019/05/06 Javascript
vue中datepicker的使用教程实例代码详解
2019/07/08 Javascript
vue图片加载失败时用默认图片替换的方法
2019/08/29 Javascript
vue 实现通过vuex 存储值 在不同界面使用
2019/11/11 Javascript
返回上一个url并刷新界面的js代码
2020/09/12 Javascript
python使用锁访问共享变量实例解析
2018/02/08 Python
10分钟用python搭建一个超好用的CMDB系统
2019/07/17 Python
对django中foreignkey的简单使用详解
2019/07/28 Python
python实现大学人员管理系统
2019/10/25 Python
利用scikitlearn画ROC曲线实例
2020/07/02 Python
如何让python的运行速度得到提升
2020/07/08 Python
浅谈html5 响应式布局
2014/12/24 HTML / CSS
skyn ICELAND官网:冰岛成分天然护肤品
2020/08/24 全球购物
分解成质因数(如435234=251*17*17*3*2,据说是华为笔试题)
2014/07/16 面试题
部队党性分析材料
2014/02/16 职场文书
2014年创卫工作总结
2014/11/24 职场文书
联村联户简报
2015/07/21 职场文书
中国文明网2015年“向国旗敬礼”活动网上签名寄语
2015/09/24 职场文书
2015小学新教师个人工作总结
2015/10/14 职场文书
如何制定销售人员薪酬制度?
2019/07/09 职场文书
浅谈Redis主从复制以及主从复制原理
2021/05/29 Redis
MySQL的表级锁,行级锁,排它锁和共享锁
2022/07/15 MySQL