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插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
jquery实现异步加载图片(懒加载图片一种方式)
Apr 24 jQuery
bootstrap+jQuery 实现下拉菜单中复选框全选和全不选效果
Jun 12 jQuery
jQuery.form.js的使用详解
Jun 14 jQuery
jQuery实现拖动效果的实例代码
Jun 25 jQuery
jQuery修改DOM结构_动力节点Java学院整理
Jul 05 jQuery
springmvc接收jquery提交的数组数据代码分享
Oct 28 jQuery
解决Jquery下拉框数据动态获取的问题
Jan 25 jQuery
基于jquery实现左右上下移动效果
May 02 jQuery
JQuery扩展对象方法操作示例
Aug 21 jQuery
jquery制作的移动端购物车效果完整示例
Feb 24 jQuery
jQuery class属性操作addClass()与removeClass()、hasClass()、toggleClass()
Mar 31 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中MD5函数使用实例代码
2008/06/07 PHP
PHP 根据IP地址控制访问的代码
2010/04/22 PHP
搭建Vim为自定义的PHP开发工具的一些技巧
2015/12/11 PHP
Zend Framework开发入门经典教程
2016/03/23 PHP
PHP实现清除MySQL死连接的方法
2016/07/23 PHP
JS模拟的QQ面板上的多级可展开的菜单
2009/10/10 Javascript
jQuery(非HTML5)可编辑表格实现代码
2012/12/11 Javascript
处理文本部分内容的TextRange对象应用实例
2014/07/29 Javascript
javascript的几种继承方法介绍
2016/03/22 Javascript
Jqprint实现页面打印
2017/01/06 Javascript
详解vue服务端渲染(SSR)初探
2017/06/19 Javascript
JavaScript深拷贝和浅拷贝概念与用法实例分析
2018/06/07 Javascript
微信小程序实现下拉菜单切换效果
2020/03/30 Javascript
bootstrap datepicker的基本使用教程
2019/07/09 Javascript
微信小程序实现时间戳格式转换
2020/07/20 Javascript
如何将Node.js中的回调转换为Promise
2020/11/10 Javascript
[17:00]DOTA2 HEROS教学视频教你分分钟做大人-帕克
2014/06/10 DOTA
[01:14]2014DOTA2展望TI 剑指西雅图newbee战队专访
2014/06/30 DOTA
python的继承知识点总结
2018/12/10 Python
解决python-docx打包之后找不到default.docx的问题
2020/02/13 Python
Django使用rest_framework写出API
2020/05/21 Python
如何教少儿学习Python编程
2020/07/10 Python
css3 盒模型以及box-sizing属性全面了解
2016/09/20 HTML / CSS
HTML5 Canvas+JS控制电脑或手机上的摄像头实例
2014/05/03 HTML / CSS
英国最受欢迎的在线隐形眼镜商店:VisionDirect.co.uk
2018/12/06 全球购物
汉语言文学毕业生求职信
2013/10/01 职场文书
学历公证委托书
2014/04/09 职场文书
实习评语大全
2014/04/26 职场文书
电子信息工程自荐信
2014/05/26 职场文书
国家奖学金获奖感言
2014/08/16 职场文书
2014年9.18纪念日演讲稿
2014/09/14 职场文书
工程催款通知书
2015/04/17 职场文书
现货白银电话营销话术
2015/05/29 职场文书
《圆的周长》教学反思
2016/02/17 职场文书
三年级作文之趣事作文
2019/11/04 职场文书
Python实现随机生成迷宫并自动寻路
2021/06/13 Python