jquery下为Event handler传递动态参数的代码


Posted in Javascript onJanuary 06, 2011

实例代码

<body> 
<div id="demo"></div> 
<button id="btn" >trigger it</button> 
<script type="text/javascript"> 
(function($) { 
//demo1 
$("#demo").bind("demo-trigger", function(e, args) { 
var info = []; 
//对应的我们从args参数中获取数据 
for(var prop in args) { 
info.push(prop + ":" + args[prop]); 
} 
this.innerHTML = info.join(';'); 
}); 
$('#btn').click(function() { 
// 我们把数据作为一个参数和我们关心的事件名一起传入trigger方法 
$('#demo').trigger('demo-trigger', { 
name:'Andrew', 
age: '23', 
job: 'FrontEnd Dev' 
}); 
}); /**demo2 
$("#demo").bind("demo-trigger", function(e) { 
var info = []; 
//我们通过传入的e.extra来获取我们传入的数据 
for(var prop in e.extra) { 
info.push(prop + ":" + e.extra[prop]); 
} 
//展现出来 
this.innerHTML = info.join(';'); 
}); 
$('#btn').click(function() { 
//这个用法很有意思 我们new一个jQuery Event对象 参数为我们关心的事件名 
var event = new jQuery.Event("demo-trigger"); 
//给这个event附加一个属性 包含我们的数据 
event.extra = { 
name:'Andrew', 
age :'23', 
job :'FrontEnd Dev' 
}; 
//最后把event传入trigger方法 ...看上面的$('#demo')..... 
$('#demo').trigger(event); 
});**/ 
})(jQuery); 
</script> 
</body>
Javascript 相关文章推荐
Open and Print a Word Document
Jun 15 Javascript
jQuery 动画弹出窗体支持多种展现方式
Apr 29 Javascript
ASP.NET jQuery 实例9  通过控件hyperlink实现返回顶部效果
Feb 03 Javascript
固定背景实现的背景滚动特效示例分享
May 19 Javascript
浅析JavaScript原型继承的陷阱
Dec 03 Javascript
ExtJS中设置下拉列表框不可编辑的方法
May 07 Javascript
JavaScript判断变量是否为空的自定义函数分享
Jan 31 Javascript
js鼠标单击和双击事件冲突问题的快速解决方法
Jul 11 Javascript
assert()函数用法总结(推荐)
Jan 25 Javascript
使用jQuery实现鼠标点击左右按钮滑动切换
Aug 04 jQuery
PHP 实现一种多文件上传的方法
Sep 20 Javascript
原生JS实现逼真的图片3D旋转效果详解
Feb 16 Javascript
Jquery下判断Id是否存在的代码
Jan 06 #Javascript
jquery关于图形报表的运用实现代码
Jan 06 #Javascript
基于Jquery的简单图片切换效果
Jan 06 #Javascript
基于jquery的分页控件(C#)
Jan 06 #Javascript
用jquery实现的模拟QQ邮箱里的收件人选取及其他效果(一)
Jan 06 #Javascript
jQuery1.3.2 升级到jQuery1.4.4需要修改的地方
Jan 06 #Javascript
基于jQuery的试卷自动排版系统实现代码
Jan 06 #Javascript
You might like
php实现计算百度地图坐标之间距离的方法
2016/05/05 PHP
在云虚拟主机部署thinkphp5项目的步骤详解
2017/12/21 PHP
仅用[]()+!等符号就足以实现几乎任意Javascript代码
2010/03/01 Javascript
浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
2014/01/10 Javascript
让浏览器DOM元素最后加载的js方法
2014/07/29 Javascript
jquery获取css的color值返回RGB的方法
2015/12/18 Javascript
底部悬浮通栏可以关闭广告位的实现方法
2016/06/01 Javascript
BootStrap智能表单demo示例详解
2016/06/13 Javascript
Javascript基础学习笔记(菜鸟必看篇)
2016/07/22 Javascript
你知道setTimeout是如何运行的吗?
2016/08/16 Javascript
jQuery图片切换动画特效
2016/11/02 Javascript
JS前端笔试题分析
2016/12/19 Javascript
js实现功能比较全面的全选和多选
2017/03/02 Javascript
ajax请求data遇到的问题分析
2018/01/18 Javascript
JavaScript布尔运算符原理使用解析
2020/05/06 Javascript
在Python中定义和使用抽象类的方法
2016/06/30 Python
pandas创建新Dataframe并添加多行的实例
2018/04/08 Python
python实现屏保程序(适用于背单词)
2019/07/30 Python
Python 实现顺序高斯消元法示例
2019/12/09 Python
完美解决Django2.0中models下的ForeignKey()问题
2020/05/19 Python
基于CentOS搭建Python Django环境过程解析
2020/08/24 Python
基于Python爬取51cto博客页面信息过程解析
2020/08/25 Python
python中pdb模块实例用法
2021/01/15 Python
北美主要的汽车零部件零售商:AutoShack.com
2019/02/23 全球购物
我的珠宝盒:Ma boîte à bijoux
2019/08/27 全球购物
英国鞋网:Rubber Sole
2020/03/03 全球购物
学习雷锋寄语大全
2014/04/11 职场文书
理想点亮人生演讲稿
2014/05/21 职场文书
机动车交通事故协议书
2015/01/29 职场文书
沈阳故宫导游词
2015/01/31 职场文书
2015年乡镇纪检工作总结
2015/04/22 职场文书
小学生安全保证书
2015/05/09 职场文书
漂亮妈妈观后感
2015/06/08 职场文书
护理心得体会范文
2016/01/22 职场文书
2019年图书室自查报告范本
2019/10/12 职场文书
CSS3 制作的图片滚动效果
2021/04/14 HTML / CSS