js解决动态绑定事件时不能传参的问题

问题描述:

js使用dom给元素绑定事件时如果直接传入参数,

会有传参失败并且语句会执行没有成功绑定事件的情况

举个例子,假如我们有一个div (id="div1"), 我们想给它绑定一个onclick事件并传入字符串参数:

(错误案例, 会导致如上后果)

var div=document.getElementById('div1');
div.onclik=fun('传入实参');
function fun(arg)
{
    alert(arg);
}

会导致加载页面时就执行了,并没有等到点击事件触发, 并且点击后不执行;

 

 正确的绑定方式是这样的:

var div=document.getElementById('div1');
div.onclik=fun;
function fun()
{
    alert("");
}

 也就是直接把方法名赋给 dom对象的onclick事件,

但这样就不能传参了啊, 别急,老衲有一妙计

带参数的绑定:

var div=document.getElementById('div1');
div.onclik=function () { fun("此处传入实参");  }

function fun(arg)
{
    alert(arg);
}

 也就是说除了直接把方法名赋给 dom对象的onclick事件,

还可以在onclick事件事件后定义一个方法, 我们可以在方法体中掉用我们真正的方法并传入我们想要的参数,

需要注意的是:

临时定义的这个函数中 this指的是div对象, 所以我们想传入div对象时使用 this就可以了

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值