给Event handler传递动态参数
有段时间没写些东西了......参加工作大半年 感觉是收获不小啊 新年以致
在这里我想真心的祝福所有园友 所有有梦想的人 新的一年技术更牛X 身体棒棒 职业发展更上一层
好了 回过来讲主要内容.
在jquery cook book里看到一篇给event handler传递动态参数的文章 感觉挺实用的 跟大家分享下
直接拿例子吧...
1 <body> 2 <div id="demo"></div> 3 <button id="btn" >trigger it</button> 4 <script type="text/javascript"> 5 (function($) { 6 //demo1 7 $("#demo").bind("demo-trigger", function(e, args) { 8 var info = []; 9 //对应的我们从args参数中获取数据 10 for(var prop in args) { 11 info.push(prop + ":" + args[prop]); 12 } 13 this.innerHTML = info.join(';'); 14 }); 15 $('#btn').click(function() { 16 // 我们把数据作为一个参数和我们关心的事件名一起传入trigger方法 17 $('#demo').trigger('demo-trigger', { 18 name:'Andrew', 19 age: '23', 20 job: 'FrontEnd Dev' 21 }); 22 }); 23 24 /**demo2 25 $("#demo").bind("demo-trigger", function(e) { 26 var info = []; 27 //我们通过传入的e.extra来获取我们传入的数据 28 for(var prop in e.extra) { 29 info.push(prop + ":" + e.extra[prop]); 30 } 31 //展现出来 32 this.innerHTML = info.join(';'); 33 }); 34 $('#btn').click(function() { 35 //这个用法很有意思 我们new一个jQuery Event对象 参数为我们关心的事件名 36 var event = new jQuery.Event("demo-trigger"); 37 //给这个event附加一个属性 包含我们的数据 38 event.extra = { 39 name:'Andrew', 40 age :'23', 41 job :'FrontEnd Dev' 42 }; 43 //最后把event传入trigger方法 ...看上面的$('#demo')..... 44 $('#demo').trigger(event); 45 });**/ 46 })(jQuery); 47 </script> 48 </body>
