jQuery动态移除与增加onclick属性的方法详解


Posted in jQuery onJune 07, 2018

本文实例讲述了jQuery动态移除与增加onclick属性的方法。分享给大家供大家参考,具体如下:

这里给大家介绍利用jquery的removeAttrattr事件来给a标签增加与删除onclick事件的具体操作方法,有需要了解的朋友可参考。

要实现效果:点击链接先去掉onclick属性,3秒后再自动加上该标签中的onclick属性

jQuery中,针对标签属性的操作都是使用attr()方法来实现的,比如:$("a").attr("onclick")可获得a标签的onclick属性,对应的:

增加事件

$(选择器).attr(属性名) 它的作用就是获取指定元素( $(选择器)部分 )的指定属性的值

如设置onclick属性:

$("a").attr("onclick","test();");

删除事件

$(selector).removeAttr(attribute)

例如 删除onclick属性:

$("a").removeAttr("onclick");

理论上上面的代码没问题,但实际上上面语句不执行也不报错,后来发现原因:

jquery 1.6之前的版本并不支持attr()方法对标签onclick属性的相关操作!

换句话说要使用attr()方法操作标签中的onclick属性必须使用jq库1.6或更新的库版本!

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function(){
 $(".b").click(function(){
 $(this).removeAttr("onclick");
 setTimeout(function(){
  $(".b").attr("onclick","test();");
  },3000)
 })
 })
function test(){}
</script>
<p>
 <a class="b" href="#" rel="external nofollow" onclick="test();">点击去掉该链接的onclick属性,3秒后再自动加上该onclick属性</a>
</p>

jquery中删除属性的关键词是: removeAttr 注意A是大写

jquery还有一个解除事件委派的方法:unbind([eventType])。参数是可选的,如果不选,则表示移除节点所有已绑定事件。

这里你只需要解除click事件,可以用$("#s1").unbind("click")来处理。

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jquery实现静态搜索功能(可输入搜索文字)
Mar 28 jQuery
jQuery Jsonp跨域模拟搜索引擎
Jun 17 jQuery
jQuery替换节点元素的操作方法
Mar 18 jQuery
详解使用jQuery.i18n.properties实现js国际化
May 04 jQuery
关于jquery中attr()和prop()方法的区别
May 28 jQuery
jQuery实现为动态添加的元素绑定事件实例分析
Sep 07 jQuery
jQuery使用each遍历循环的方法
Sep 19 jQuery
[jQuery] 事件和动画详解
Mar 05 jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 jQuery
jQuery表单校验插件validator使用方法详解
Feb 18 jQuery
Jquery cookie插件实现原理代码解析
Aug 04 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
Angular5中调用第三方库及jQuery的添加的方法
Jun 07 #jQuery
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 #jQuery
jQuery实现的简单对话框拖动功能示例
Jun 05 #jQuery
jQuery实现的滑块滑动导航效果示例
Jun 04 #jQuery
jQuery实现常见的隐藏与展示列表效果示例
Jun 04 #jQuery
jQuery实现的简单获取索引功能示例
Jun 04 #jQuery
JS与jQuery实现ListBox上移,下移,左移,右移操作功能示例
May 31 #jQuery
You might like
用PHP和ACCESS写聊天室(九)
2006/10/09 PHP
抓取并下载CSS中所有图片文件的php代码
2011/09/26 PHP
php实现批量压缩图片文件大小的脚本
2014/07/04 PHP
ecshop实现smtp发送邮件
2015/02/03 PHP
PHP addslashes()函数讲解
2019/02/03 PHP
浅谈PHPANALYSIS提取关键字
2019/03/08 PHP
javascript 日期时间函数(经典+完善+实用)
2009/05/27 Javascript
让FireFox支持innerText的实现代码
2009/12/01 Javascript
jquery $.each 和for怎么跳出循环终止本次循环
2013/09/27 Javascript
简单实现js悬浮导航效果
2017/02/05 Javascript
JavaScript中从setTimeout与setInterval到AJAX异步
2017/02/13 Javascript
Angular开发实践之服务端渲染
2018/03/29 Javascript
解决LayUI表单获取不到data的问题
2018/08/20 Javascript
vuejs点击class变化的实例
2018/09/05 Javascript
JavaScript函数式编程(Functional Programming)纯函数用法分析
2019/05/22 Javascript
微信内置浏览器图片查看器的代码实例
2019/10/08 Javascript
JS实现拖拽元素时与另一元素碰撞检测
2020/08/27 Javascript
手机浏览器唤起微信分享(JS)
2020/10/11 Javascript
vue element-ui中table合计指定列求和实例
2020/11/02 Javascript
Map与WeakMap类型在JavaScript中的使用详解
2020/11/18 Javascript
arcgis.js控制地图地体的显示范围超出区域自动弹回(实现思路)
2021/01/28 Javascript
Python实现高斯函数的三维显示方法
2018/12/29 Python
python实现kmp算法的实例代码
2019/04/03 Python
python3+django2开发一个简单的人员管理系统过程详解
2019/07/23 Python
python3使用print打印带颜色的字符串代码实例
2019/08/22 Python
python 画图 图例自由定义方式
2020/04/17 Python
python保留格式汇总各部门excel内容的实现思路
2020/06/01 Python
英国山地公路自行车商店:Tweeks Cycles
2018/03/16 全球购物
荷兰睡眠专家:Beter Bed
2020/11/23 全球购物
音乐学个人的自荐书范文
2013/11/26 职场文书
建筑系毕业生自我鉴定
2014/01/24 职场文书
毕业生如何写自荐信
2014/03/26 职场文书
员工工作表扬信
2015/05/05 职场文书
董事长致辞
2015/07/29 职场文书
幼儿园国培研修日志
2015/11/13 职场文书
MySQL中的 inner join 和 left join的区别解析(小结果集驱动大结果集)
2023/05/08 MySQL