JavaScript事件处理程序传递参数
来源:互联网 发布:画漫画软件下载 编辑:程序博客网 时间:2024/06/06 17:50
//定义类class1function class1(){//构造函数}class1.prototype={show:function(){//show函数的实现this.onShow(); //触发onShow事件},onShow:function(){} //定义事件接口}//创建class1的实例var obj=new class1();//创建obj的onShow事件处理程序function objOnShow(userName){alert(“hello,”+userName);}//定义变量userNamevar userName=”jack”;//绑定obj的onShow事件obj.onShow=objOnShow; //无法将userName这个变量传递进去//调用obj的show方法obj.show();
注意上面的obj.onShow=objOnShow 事件绑定语句,不能够为了传递userName 进去而写成:
obj.onShow=objOnShow(userName);
或者:
obj.onShow=”objOnShow(userName)”;
前者是将objOnShow(userName)的运行结果赋给了obj.onShow,而后者是将字符串
“objOnShow(userName)”赋给了obj.onShow。
要解决这个问题,可以从相反的思路去考虑,不考虑怎么把参数传进去,而是考虑如何构建一个无需参数的事件处理程序,该程序是根据有参数的事件处理程序创建的,是一个外层的封装。现在自定义一个通用的函数来实现这种功能:
//将有参数的函数封装为无参数的函数function createFunction(obj,strFunc){ //其中obj接收函数归属的对象,strFunc接收要处理事件的函数var args=[]; //定义args用于存储传递给事件处理程序的参数if(!obj)obj=window; //如果是全局函数则obj=window;//得到传递给事件处理程序的参数for(var i=2;i<arguments.length;i++)args.push(arguments[i]);//用无参数函数封装事件处理程序的调用return function(){obj[strFunc].apply(obj,args); //这句代码是关键。将参数传递给指定的事件处理程序}}
该方法将一个有参数的函数封装为一个无参数的函数,不仅对全局函数适用,对作为对象方法存在的函数同样适用。该方法首先接收两个参数:obj 和strFunc,obj 表示事件处理程序所在的对象;strFunc 表示事件处理程序的名称。除此以外,程序中还利用arguments对象处理第二个参数以后的隐式参数(即未定义形参的参数),并在调用事件处理程序时将这些参数传递进去。例如一个事件处理程序是:
someObject.eventHandler=function(_arg1,_arg2){//事件处理代码}
应该调用:
createFunction(someObject,”eventHandler”,arg1,arg2);
这就返回一个无参数的函数,在返回的函数中已经包括了传递进去的参数。如果是全局函数作为事件处理程序,事实上它是window 对象的一个方法,所以可以传递window 对象作为obj参数,要是为了更清晰一点,也可以指定obj 为null,createFunction函数内部会自动认为该函数是全局函数,从而自动把obj赋值为window。下面来看应用的例子:
<script language="JavaScript" type="text/javascript"><!--//将有参数的函数封装为无参数的函数function createFunction(obj,strFunc){var args=[];if(!obj)obj=window;for(var i=2;i<arguments.length;i++)args.push(arguments[i]);return function(){obj[strFunc].apply(obj,args);}}//定义类class1function class1(){//构造函数}class1.prototype={show:function(){//show函数的实现this.onShow(); //触发onShow事件},onShow:function(){} //定义事件接口}//创建class1的实例var obj=new class1();//创建obj的onShow事件处理程序function objOnShow(userName){alert(“hello,”+userName);}//定义变量userNamevar userName=”jack”;//绑定obj的onShow事件obj.onShow=createFunction(null,”objOnShow”,userName);//调用obj的show方法obj.show();//--></script>
在这段代码中,就将变量userName作为参数传递给了objOnShow事件处理程序。事实上,obj.onShow得到的事件处理程序并不是objOnShow,而是由createFunction返回的一个无参函数。通过createFunction 这的封装,就可以用一种通用的方案实现参数传递了。这不仅适用于自定义的事件,也适用于系统提供的事件,其原理是完全相同的。
- JavaScript事件处理程序传递参数
- JAVASCRIPT中给事件处理程序传递参数
- 微信小程序-参数传递与事件处理
- 微信小程序-传递多个参数与事件处理
- javascript事件处理程序
- javascript事件处理程序
- javascript事件处理程序
- JavaScript:事件处理程序
- JavaScript 事件处理程序
- JavaScript事件处理程序
- JS事件传递参数-Javascript事件动态传参-原生JS事件传递参数-Javascript onclick事件传递参数
- JavaScript为事件处理器传递参数
- 给wxPython事件处理函数传递参数
- React 向事件处理程序传递参数(不跳,alert)
- javascript通用事件处理程序
- JavaScript中的事件处理程序
- Javascript中的事件处理程序
- JavaScript 指定事件处理程序
- 禁用ViewState
- asp.net 自定义错误页
- ASP.NET中加密与解密QueryString的方法
- Asp.net url传递中文的解决方案
- form表单上传文件
- JavaScript事件处理程序传递参数
- 155. Far from eye, far from heart. 眼不见,心不烦
- Mobile Web网站参考
- 107个常用Javascript语句
- JavaBean-XML组件轻松实现JavaBeans到XML的相互转换
- 移动Web开发与html 5实践经验分享:139邮箱工程师
- PHP定时执行的小代码
- 开源DBCP、C3P0、Proxool 、 BoneCP连接池的比较
- JQuery Mobile入门参考资料