通过JQ 控制范围内所有a标签的点击事件

最新推荐文章于 2021-06-17 14:38:47 发布
最新推荐文章于 2021-06-17 14:38:47 发布
阅读量1.4k 收藏 3
点赞数
文章标签： html jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37447338/article/details/104184838
版权
本文介绍了在项目中遇到需要为多个不同id的a标签绑定相同点击事件的问题，如何通过jQuery优雅地解决。通过为a标签设置id，然后利用JQ获取点击的id并执行相应事件处理，避免了重复编写代码的繁琐。
摘要由CSDN通过智能技术生成

写项目的时候遇到个问题，一个页面不同id的a标签要绑定同样事件，一开始想到的是，为每一个a标签添加对应id的js，但是实在太麻烦了，而且代码多，故想了以下解决办法。

做法：首先给标签绑定id，通过JQ 获取被点击的标签的id，再根据id处理对应事件

html 代码

				<div class="faq-content-text">
                    <a type="button" class="faq-content-issue" id="1">上电后电源指示灯不亮<span
                            class="glyphicon glyphicon-menu-down faq-content-arrows" id="arrows1"></span></a>
                    <p class="faq-content-answer" id="answer1">1、检查电源线是否有破损，连接顺序是否正确，确认电源接口连接
最低0.47元/天 解锁文章
猫猫猫不是猫
关注
关于KBYCMS标签使用说明介绍
07-27 375
选中的class，例如class等于active，假设第二张图片为加载页面后首先看到的，那么current="2"，第二张图集currentstyle里面就有值为active。mod输出奇数偶数记录，设mod="2"，标签内会有$mod变量，里面的值每次计算到2的时候重新计数例如（1，2，1，2，1，2）：后台模型管理，新建留言表单，如果安装的是演示数据，那么已经存在留言表单了，创建好后点击字段管理进入，如下图所示。限定字段，当有时候不想显示所有筛选字段，在这里可以指定筛选的字段。
a 标签中调用js的几种方法
热门推荐
余书懿
04-09 14万+
我们常用的在a标签中有点击事件： 1. a href="javascript:js_method();" 这是我们平台上常用的方法，但是这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行java
js给li标签中的所有a标签加点击事件
yangzhao6628的博客
11-18 8428
javascript中 $('#sportsItem2 a').click( function() { var $this = $(this); $ids = $this.attr("id"); console.info($ids); $("#club-list").empty(); $this.addClass("on").parents().siblings() .chil
jquery给每个a标签添加点击事件
shayne
11-02 4610
$(".aside-body a").each(function(){ $(this).click(function(event){ event.preventDefault() $(".aside-body a").removeClass('act') $(this).addClass('act') })})
为所有a标签绑定同一个事件（闭包）
King_crazy的博客
09-09 1832
css代码：body{text-align:center;} body table{margin:0 auto;} table{border-collapse:collapse; border:solid 1px Black; } table td,th{border:solid 1px; padding:5px;}html代码：<html> <head> <title>user.htm
jquery获取DIV下a标签点击事件记录
无与伦比的傻
11-04 1199
jquery获取DIV下a标签点击事件记录 $("#div").on("click",'a',function () { var aHref=$(this).attr("href"); });
jQuery常见事件的监听方式
Erudite_x的博客
06-03 1121
在 Web 页面经常会有各种事件发生，事件发生后需要进行一些特定处理，即执行特定的函数或者语句。这就需要对事件进行监听，监听事件的常见方式有以下三种，本人将通过实例来具体介绍。 1.HTML标签内联事件 实例1：单击页面 “Hello” 按钮，弹出提示框显示 Hello world！ <!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> &lt
css+js+jq实训笔记
weixin_42757570的博客
07-02 1371
css+js+jq实训笔记css第一天css第二天css第三天css第四天css第五天css第六天js第一天js第二天js第三天js第四天js第五天js第六天jq第一天jq第二天jq第三天 css第一天 1、平时有空多记单词（很多新单词） 2、用谷歌浏览器调试代码 3、多看看公众号和网站（对面试有很大的帮助，也可以帮助了解前端） 4、爱果果（可以去玩一下） 5、egret白鹭科技（游戏开发） 6、小程序API，要学会读懂文档、手册 7、学习PS 8、提高自己的审美 9、计算机网络、数据结构 考研408 10
前端面试基础合集——JQ
HarryHY的博客
12-27 589
1.html5新特性和css3的新特性有哪些？ html5新特性： 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 localStorage&sessionStorage 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、emai...
轻量级jQuery插件slideBox实现带底栏轮播(焦点图)代码
10-22
每张图片都需要放置在一个<a>标签内，并可选地在<a>标签上添加title属性作为图片的标题。图片本身则通过标签引用。 知识点五：配置参数与实现效果的关联 通过为不同的元素指定不同的配置参数，可以实现不同效果的...
点击A标签执行js或jquery脚本
gzp4836博客
12-25 2346
使用A标签执行JS脚本的几种方式 1、href="javascript:js_method();" 这是我们最常用的方法，但是这种方法在传递this等参数的时候很容易出问题，而且javascript:协议作为a的href属性的时候不仅会导致不必要的触发window.onbeforeunload事件，在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行javascr
JQuery范围选择器
荣耀之路
11-29 1766
JQuery根据索引范围选择元素
Jquery为DIV添加点击事件,Jquery为a标签超链接添加点击事件
weixin_34128534的博客
12-01 297
Js代码 <div>1</div> <div>2</div> <div>3</div> <div>4</div> <div>5</div> 为这5个DIV绑定点击事件，当点击第2个的时候弹出提示2,第4...
【jQuery】点击特定区域才触发事件
冰冷的希望的博客
06-17 565
1.说明 我们可以使用jQuery轻松监听各种事件，比如说点击、双击、鼠标进入等等，但是那是全局了，如果我们想要在某个组件才发生操作，比如说在某个div内右键才会弹窗自定义的窗口 2.代码 <script type="text/javascript"> function showRightMenu(data) { $(document).contextmenu(function(e) { e.stopPropagation(); //阻止冒泡
在Google Chrome浏览器中轻松控制大量标签
culintai3473的博客
09-19 621
Do things start to get out of control for you when you have a lot of tabs open in Google Chrome? Get control back and easily manage those tabs with the Tab Menu extension. 当您在Google Chrome浏览器中打开许多标签页...
js中重写a标签的href属性和onclick事件
yangrenjunjiayou的博客
04-28 1万+
重写a标签的href属性和onclick事件
创建10个a标签 点击弹出对应序号
qq_24917475的博客
02-26 412
错误写法： var i, a for (i = 0; i< 10; i++) { a = document.createElement('a'); a.innerHTML = i + "<br>"; a.addEventListener("click", function(e) { e.preventDefault(); alert(i); }) documen...
用jq查找该元素的父级标签的兄弟标签下的a标签
最新发布
05-26
假设要查找的元素是一个id为"myElement"的div，可以使用...这将首先选择id为"myElement"的div，然后通过parent()方法选择它的父级标签，再通过siblings()方法选择它的兄弟标签，最后通过find()方法选择所有的a标签。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值