基于jquery trigger函数无法触发a标签的两种解决方法


Posted in jQuery onJanuary 06, 2018

起因:点击icon图标后要触发a标签的链接转跳动作,但是用 JQ 的 $('#a').trigger('click') 居然不起作用,遂百度之,总结两种方法如下:

(原因:JQ 的 trigger() 方法确实无法触发 a 标签的转跳动作。)

1:JQ 方法:

对目标 a 标签内部新增一个 span 标签 ,然后给 span 标签绑定 trigger('click') 事件。

$('#a').html('<span></span>').children().trigger('click');

(原因:JQ trigger函数也支持冒泡)

(a标签内有东西的话可以用 appendTo() 等其他函数追加标签)

2:JQ+JS方法:(推荐)

将 $('#a') 转换为 JS 对象,然后触发 click 事件。

$('#a')[0].click();

总结:个人感觉第二种方法简单方便,推荐使用。

另:如有错误,请批评指正。

以上这篇基于jquery trigger函数无法触发a标签的两种解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 jQuery
jQuery常用选择器详解
Jul 17 jQuery
jQuery实现html双向绑定功能示例
Oct 09 jQuery
javascript+jQuery实现360开机时间显示效果
Nov 03 jQuery
实现jquery放大镜的两种方法
Feb 22 jQuery
jQuery实现使用sort方法对json数据排序的方法
Apr 17 jQuery
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 jQuery
jQuery实现的网站banner图片无缝轮播效果完整实例
Jan 28 jQuery
一文快速了解JQuery中的AJAX
May 31 jQuery
layui+jquery支持IE8的表格分页方法
Sep 28 jQuery
JQuery常用简单动画操作方法回顾与总结
Dec 07 jQuery
JS JQuery获取data-*属性值方法解析
Sep 01 jQuery
jQuery中库的引用方法
Jan 06 #jQuery
jQuery封装animate.css的实例
Jan 04 #jQuery
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 #jQuery
jQuery实现手机号正则验证输入及自动填充空格功能
Jan 02 #jQuery
jQuery动态添加元素无法触发绑定事件的解决方法分析
Jan 02 #jQuery
基于jquery.page.js实现分页效果
Jan 01 #jQuery
jquery实现企业定位式导航效果
Jan 01 #jQuery
You might like
PHP中的正则表达式函数介绍
2012/02/27 PHP
PHP批量采集下载美女图片的实现代码
2013/06/03 PHP
php连接Access数据库错误及解决方法
2013/06/20 PHP
调试PHP程序的多种方法介绍
2014/11/06 PHP
浅析Yii2集成富文本编辑器redactor实例教程
2016/04/25 PHP
在Thinkphp中使用ajax实现无刷新分页的方法
2016/10/25 PHP
简洁短小的 JavaScript IE 浏览器判定代码
2010/03/21 Javascript
一个页面放2段图片滚动代码出现冲突的问题如何解决
2012/12/21 Javascript
javascript页面动态显示时间变化示例代码
2013/12/18 Javascript
JS嵌套函数调用上下文的问题解决
2014/03/26 Javascript
jQuery中:empty选择器用法实例
2014/12/30 Javascript
浅谈jquery.fn.extend与jquery.extend区别
2015/07/13 Javascript
分享自己用JS做的扫雷小游戏
2016/02/17 Javascript
jQuery animate easing使用方法图文详解
2016/06/17 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
bootstrap轮播图示例代码分享
2017/05/17 Javascript
jQuery图片加载失败替换默认图片方法汇总
2017/11/29 jQuery
Node.js 使用AngularJS的方法示例
2018/05/11 Javascript
浅析Vue.js中v-bind v-model的使用和区别
2018/12/04 Javascript
一个Java程序猿眼中的前后端分离以及Vue.js入门(推荐)
2019/04/19 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
2020/01/17 Javascript
Vue动态加载图片在跨域时无法显示的问题及解决方法
2020/03/10 Javascript
H5+css3+js搭建带验证码的登录页面
2020/10/11 Javascript
vue表单验证之禁止input输入框输入空格
2020/12/03 Vue.js
[01:11:46]DOTA2-DPC中国联赛 正赛 iG vs Magma BO3 第一场 2月23日
2021/03/11 DOTA
详解python校验SQL脚本命名规则
2019/03/22 Python
python 弹窗提示警告框MessageBox的实例
2019/06/18 Python
python算法题 链表反转详解
2019/07/02 Python
python调用接口的4种方式代码实例
2019/11/19 Python
Python内置函数property()如何使用
2020/09/01 Python
Python通过yagmail实现发送邮件代码解析
2020/10/27 Python
美国领先的奢侈美容零售商:Bluemercury
2017/07/26 全球购物
体现团队精神的口号
2014/06/06 职场文书
报考公务员诚信承诺书
2014/08/29 职场文书
2014三年级班主任工作总结
2014/12/05 职场文书
Python如何将list中的string转换为int
2022/07/15 Ruby