jquery用data方法获取某个元素上的事件


Posted in Javascript onJune 23, 2014

jquery的给元素绑定的事件可以用data方法取出来

通过$(element).data("events")来获取

// 比如给一个button绑定两个click事件

$("button").click(function() { alert("1") });
$("button").click(function() { alert("2") });

// 这个时候点击该button会分别弹出 2 和1的alert框
// 取出该button的所有click事件,是个数组
$("button").data('events').click

会看到两个click事件的数组

得到该数组,你可以调整顺序后再设回去

$("button").data('events').click = newEventArray;

下面是这个方法的测试页面:

<span style="font-size:18px;"><%@ page contentType="text/html;charset=UTF-8" language="java" %> 

<!DOCTYPE HTML> 
<html> 
<head> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>测试jquery动态改变事件</title> 

<script type="text/javascript" src="/static/lib/jquery-1.6.2.min.js"></script> 
<script type="text/javascript" src="/static/lib/jquery.cookie.min.js"></script> 
<script type="text/javascript" src="/static/lib/util.min.js"></script> 
<script type="text/javascript" src="/static/lib/jquery.bgiframe.min.js"></script> 
<script type="text/javascript" src="/static/lib/jshashtable.min.js"></script> 
</head> 
<body> 
<h1>该demo用于测试jquery附加了事件以后可不可以动态改变事件有无,及顺序</h1> 
<input id="btn" type="button" value="点击我执行事件,分别执行三个次序弹窗"/><br/> 
<input id="btn_clear" type="button" value="点击清空执行事件,清空后第一个按钮无反应"/><br/> 
<input id="btn_revert" type="button" value="点击还原执行事件,点击后第一个按钮又会有反应"/><br/> 
<input id="btn_seq" type="button" value="点击我改变执行事件顺序,顺序会改变"/><br/> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#btn").click(function(){ 
alert(1); 
}); 
$("#btn").click(function(){ 
alert(2); 
}); 
$("#btn").click(function(){ 
alert(3); 
}); 
var _arr_events= $("#btn").data("events")["click"]; 
$("#btn_clear").click(function(){ 
$("#btn").data("events")["click"]=undefined; 
}); 
$("#btn_revert").click(function(){ 
$("#btn").data("events")["click"]=_arr_events; 
}); 

}); 
</script> 
</body> 
</html> 
</span>
Javascript 相关文章推荐
用 JSON 处理缓存
Apr 27 Javascript
js有关元素内容操作小结
Dec 20 Javascript
Jquery判断$(&quot;#id&quot;)获取的对象是否存在的方法
Sep 25 Javascript
Vue监听数组变化源码解析
Mar 09 Javascript
vue.js 初体验之Chrome 插件开发实录
May 13 Javascript
常用的9个JavaScript图表库详解
Dec 19 Javascript
vue项目使用axios发送请求让ajax请求头部携带cookie的方法
Sep 26 Javascript
vue中的mvvm模式讲解
Jan 31 Javascript
vue权限问题的完美解决方案
May 08 Javascript
js实现开关灯效果
Mar 30 Javascript
js实现带搜索功能的下拉框
Jan 11 Javascript
vue 防止页面加载时看到花括号的解决操作
Nov 09 Javascript
如何正确使用javascript 来进行我们的程序开发
Jun 23 #Javascript
js实现键盘操作实现div的移动或改变的原理及代码
Jun 23 #Javascript
JavaScript-RegExp对象只能使用一次问题解决方法
Jun 23 #Javascript
jquery中map函数与each函数的区别实例介绍
Jun 23 #Javascript
jQuery学习笔记之 Ajax操作篇(二) - 数据传递
Jun 23 #Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
Jun 23 #Javascript
jquery让返回的内容显示在特定div里(代码少而精悍)
Jun 23 #Javascript
You might like
自动生成文章摘要的代码[PHP 版本]
2007/03/20 PHP
一个不易被发现的PHP后门代码解析
2014/07/05 PHP
php面向对象中static静态属性与方法的内存位置分析
2015/02/08 PHP
Yii2.0 模态弹出框+ajax提交表单
2016/05/22 PHP
JS加jquery简单实现标签元素的显示或隐藏
2013/09/23 Javascript
JS实现点击按钮自动增加一个单元格的方法
2015/03/09 Javascript
jQuery仿Flash上下翻动的中英文导航菜单实例
2015/03/10 Javascript
jquery调整表格行tr上下顺序实例讲解
2016/01/09 Javascript
js 求时间差的实现代码
2016/04/26 Javascript
jquery简单插件制作(fn.extend)完整实例
2016/05/24 Javascript
老生常谈 js中this的指向
2016/06/30 Javascript
jQuery动态改变多行文本框高度的方法
2016/09/07 Javascript
微信js-sdk分享功能接口常用逻辑封装示例
2016/10/13 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
node+express+ejs使用模版引擎做的一个示例demo
2017/09/18 Javascript
vue 数组和对象不能直接赋值情况和解决方法(推荐)
2017/10/25 Javascript
JavaScript中的一些隐式转换和总结(推荐)
2017/12/22 Javascript
vue实现多个元素或多个组件之间动画效果
2018/09/25 Javascript
用 js 写一个 js 解释器过程详解
2019/08/02 Javascript
微信小程序获取地理位置及经纬度授权代码实例
2019/09/18 Javascript
vue-openlayers实现地图坐标弹框效果
2020/09/24 Javascript
python中验证码连通域分割的方法详解
2018/06/04 Python
Python实现去除列表中重复元素的方法总结【7种方法】
2019/02/16 Python
详解python校验SQL脚本命名规则
2019/03/22 Python
Python进程的通信Queue、Pipe实例分析
2020/03/30 Python
canvas使用注意点总结
2013/07/19 HTML / CSS
澳大利亚牛仔裤商店:Just Jeans
2016/10/13 全球购物
优秀女职工事迹材料
2014/02/06 职场文书
销售总经理岗位职责
2014/03/15 职场文书
中学感恩教育活动总结
2015/05/05 职场文书
给女朋友的道歉短信
2015/05/12 职场文书
2015年预防青少年违法犯罪工作总结
2015/05/22 职场文书
2015年超市工作总结范文
2015/05/26 职场文书
朋友聚会祝酒词
2015/08/10 职场文书
升学宴祝酒词
2015/08/11 职场文书
vue+springboot实现登录验证码
2021/05/27 Vue.js