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树插件zTree使用方法详解
May 02 jQuery
jquery Form轻松实现文件上传
May 24 jQuery
详谈表单格式化插件jquery.serializeJSON
Jun 23 jQuery
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 jQuery
jQuery封装animate.css的实例
Jan 04 jQuery
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
jQuery事件blur()方法的使用实例讲解
Mar 30 jQuery
基于jQuery的时间戳与日期间的转化
Jun 21 jQuery
js、jquery实现列表模糊搜索功能过程解析
Mar 27 jQuery
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
jQuery实现可以扩展的日历
Dec 01 jQuery
jQuery实现手风琴特效
Jan 11 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 配置open_basedir 让各虚拟站点独立运行
2009/11/12 PHP
php删除字符串末尾子字符,删除开始字符,删除两端字符(实现代码)
2013/06/27 PHP
PHP删除数组中特定元素的两种方法
2013/07/02 PHP
PHP数据过滤的方法
2013/10/30 PHP
PHP合并数组+号和array_merge的区别
2015/06/25 PHP
简单谈谈php浮点数精确运算
2016/03/10 PHP
php 如何禁用eval() 函数实例详解
2016/12/01 PHP
PHP数组操作实例分析【添加,删除,计算,反转,排序,查找等】
2016/12/24 PHP
php中文乱码问题的终极解决方案汇总
2017/08/01 PHP
CI框架教程之优化验证码机制详解【验证码辅助函数】
2019/04/16 PHP
laravel 框架执行流程与原理简单分析
2020/02/01 PHP
如何在Laravel之外使用illuminate组件详解
2020/09/20 PHP
js ondocumentready onmouseover onclick onmouseout 样式
2010/07/22 Javascript
实测jquery data()如何存值
2013/08/18 Javascript
jquery获取div距离窗口和父级dv的距离示例
2013/10/10 Javascript
用js控制组织结构图可以任意拖拽到指定位置
2014/01/17 Javascript
JavaScript跨浏览器获取页面中相同class节点的方法
2015/03/03 Javascript
JS实现方向键切换输入框焦点的方法
2015/08/19 Javascript
Hallo.js基于jQuery UI所见即所得的Web编辑器
2016/01/26 Javascript
Bootstrap基本样式学习笔记之标签(5)
2016/12/07 Javascript
JavaScript requestAnimationFrame动画详解
2017/09/14 Javascript
vuex + axios 做登录验证 并且保存登录状态的实例
2018/09/16 Javascript
element-ui的回调函数Events的用法详解
2018/10/16 Javascript
使用 Supervisor 监控 Python3 进程方式
2019/12/05 Python
python实现ftp文件传输功能
2020/03/20 Python
PyQt5连接MySQL及QMYSQL driver not loaded错误解决
2020/04/29 Python
python查看矩阵的行列号以及维数方式
2020/05/22 Python
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
Jo Malone美国官网:祖玛珑香水
2017/03/27 全球购物
美国打印机墨水和碳粉购物网站:QuikShip Toner
2018/08/29 全球购物
企业安全生产月活动总结
2014/07/05 职场文书
机械专业求职信范文
2014/07/15 职场文书
统计学教授推荐信
2014/09/18 职场文书
道路交通事故赔偿协议书
2014/10/24 职场文书
班级元旦晚会开幕词
2016/03/04 职场文书
Redis如何一键部署脚本
2021/04/12 Redis