今天在html页面中利用οnclick=”xxx”来监听js中一个function xxx(){}函数,遇到一个很奇怪的问题就是点击按钮之后竟然没有响应xxx()函数。
按钮代码:
<div id="stopgame" οnclick="test()">||</div>
js代码:
<script type="text/javascript">
window.onload = function(){
function test(){
alert("进入测试函数");
}
}
</script>
会出现这样的问题,不能调用test()方法
变换一下代码:
按钮代码:
<div id="stopgame" οnclick="test1()">||</div>
js代码:
<script type="text/javascript">
window.onload = function(){
function test(){
alert("进入测试函数");
}
}
function test1(){
alert("进入test1函数");
}
</script>这样访问就没有问题。
出现这样的问题是作用域的问题:
加上window.onload后改变了test()函数的作用域,使其成为内部函数,故而οnclick=”“无法访问到这个函数,而放到外面test1()是绑定在window上的,所以οnclick=”“能够访问到。
那么现在又有一个新的需求,我就是想在页面加载完成之后再执行函数怎么办,其实我们可以改变onload()里面函数的作用域为绑定在window上的,用的方法就是对象.函数。
做一下改变这样就没有问题了:
按钮代码:
<div id="stopgame" οnclick="test()">||</div>
js代码:<script type="text/javascript">
window.onload=function(){
var stopgame=document.getElementById("stopgame");
stopgame.test
=function(){
alert("进入了test函数");
}
}
</script>
问题就解决了