关于this

<input type="button" id="start" value="开始" onmouseover="btnFun(this,'#f00')" onmouseout="btnFun(this,'#ccc')">
<input type="button" id="end" value="结束" onmouseover="btnFun(this,'#00f')" onmouseout="btnFun(this,'#ccc')">
<script type="text/javascript">
function btnFun(btn, bgcolor){
btn.style.color=bgcolor;
}

为什么html时间不能直接用this,而是需要写当前按钮对象参数btn；但是btn1.onclick=btnFun;
这种形式调用却可以直接用this 不用传参？

Sunshine518 2018-04-11

源自：JavaScript DOM事件 2-4 编程练习

收起

2回答

怎么都被占用了呢 2018-04-11 12:05:56

不传this的话，获取不到当前要执行js的目标节点，在js里可以，是因为已经通过document.getElement之类的写法来获取到节点了。

收起回答

怎么都被占用了呢 2018-04-11 10:41:59

不太明白你的意思呢，这不是用了this么

而且你说的btn1.onclick=btnFun;这种情况也是要传参的，因为定义的btnFun是有形参的，调用的时候不传参，会报错的。

收起回答

提问者 Sunshine518 #1

<input type="button" id="start" value="开始"> <script type="text/javascript"> function btnFun(){ this.style.color='#f00'; } var btn=document.getElementById('start'); btn.onclick=btnFun; </script> 这样调用就可以this是时间对象的引用，而提问的那种却需要用传参数的形式才是this，如果不用 function btnFun(btn, bgcolor){ btn.style.color=bgcolor; } 里面的btn参数直接写this就会报错为什么

2018-04-11 11:04:58
提问者 Sunshine518 #2

<input type="button" id="start" value="开始"> <script type="text/javascript"> function btnFun(){ this.style.color='#f00'; } var btn=document.getElementById('start'); btn.onclick=btnFun; </script> 这样调用就可以this是事件对象的引用，而提问的那种却需要用传参数的形式用this，如果不用 function btnFun(btn, bgcolor){ btn.style.color=bgcolor; } 里面的btn参数直接写this就会报错为什么抱歉刚才的回复删不掉写错字了

2018-04-11 11:07:22
提问者 Sunshine518 #3

简单一点就是：<input type="button" id="start" value="开始" onmouseover="btnFun('#f00')" onmouseout="btnFun('#ccc')"> <script type="text/javascript"> function btnFun( bgcolor){ this.style.color=bgcolor; } </script> 为什么这样调用会报错

2018-04-11 11:09:09