源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

给事件响应函数传参数的四种方式小结

  • 时间:2020-09-27 10:49 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:给事件响应函数传参数的四种方式小结
如何给事件handler传参数?在刚刚接触Javascript的时候,由于对闭包理解不深刻,常常纠结于该问题。 在讨论群里也经常碰到这样的问题,如下
[url=#] <script type="text/javascript">   var E = {    on : function(el, type, fn){     el.addEventListener ?      el.addEventListener(type, fn, false) :      el.attachEvent("on" + type, fn);    },    un : function(el,type,fn){     el.removeEventListener ?      el.removeEventListener(type, fn, false) :      el.detachEvent("on" + type, fn);      }   };   var v1 = 'jack', v2 = 'lily';         function handler(arg1,arg2){    alert(arg1);    alert(arg2);   }   // 如何把参数v1,v2传给handler?   // 默认事件对象将作为handler的第一个参数传入,   // 这时点击链接第一个弹出的是事件对象,第二个是undefined。       E.on(document.getElementById('aa'),'click',handler);  </script> </body> </html>
如何把参数v1,v2传给handler?默认事件对象将作为handler的第一个参数传入,这时点击链接第一个弹出的是事件对象,第二个是undefined。 方案一 ,未保留事件对象作为第一个参数传入 方案二,保留事件对象作为第一个参数 
[u]复制代码[/u] 代码如下:
function handler(e,arg1,arg2){  alert(e);  alert(arg1);  alert(arg2); } E.on(document.getElementById('aa'),'click',function(e){  handler(e,arg1,arg2); });
方案三,给Function.prototype添加getCallback,不保留事件对象
[u]复制代码[/u] 代码如下:
Function.prototype.getCallback = function(){  var _this = this, args = arguments;    return function(e) {         return _this.apply(this || window, args);     }; } E.on(document.getElementById('aa'),'click',handler.getCallback(v1,v2));
方案四,给Function.prototype添加getCallback,保留事件对象作为第一个参数传入
[u]复制代码[/u] 代码如下:
Function.prototype.getCallback = function(){  var _this = this, args = [];  for(var i=0,l=arguments.length;i<l;i++){   args[i+1] = arguments[i];  }  return function(e) {   args[0] = e;         return _this.apply(this || window, args);     }; } E.on(document.getElementById('aa'),'click',handler.getCallback(v1,v2));
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部