高分wanted: 一个作用域的问题

shadowkiss 2007-01-22 01:44:18

代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js问题</title>
<style type="text/css">

</style>
</head>
<script>
function Debug(num){
this.num = num;
this.out = function(){
alert(this.num);
}
}
var dbg = new Debug(555);
</script>
<body>

<div id="Layer1" onclick="dbg.out()">clickme</div>
<script>
document.getElementById('Layer1').onclick = dbg.out; //注册事件则有问题:显示undefined 为什么不显示 555???
alert(document.getElementById('Layer1').onclick);//ok 没问题
</script>
</body>
</html>

简单的小程序,但是如出了上面描述中的问题,我想知道为什么通过
document.getElementById('Layer1').onclick = dbg.out;得不到我要的结果, 是否是变量做用域的问题?

谢谢各位

...全文

200 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

xiao7cn 2007-01-22

打赏
举报

wanted
[5wCntid]
adj.
wanted by the police 被通缉的

tjgjp 2007-01-22

打赏
举报

haothing(haothing) 所说的“this指的是运行时的对象也就是'Layer1' 而不是定义时的对象(Debug)”确实有道理。受教了。呵呵。
不过，我的那种方法就是单纯从静态方面考虑的，也就是用面向对象的方法看问题，这样不用容易引起混乱。毕竟JS是一种动态的非编译性的语言。所以它很灵活，所以一种结果，可以有很多种的表现形式。所以这也是JS的魅力所在。呵呵

shadowkiss 2007-01-22

打赏
举报

感谢 Carignano(Carignano) wzhiyuan(我是谁)
还有个小问题问一下

tjgjp()所写的
"this.out = function(){
alert(this.num);
}
改为
this.out = function(){
alert(num);
}"

这样document.getElementById('Layer1').onclick = dbg.out;
就可以正确执行了

可是 num 只是一个对象构造时的参数, 而 dbg.out这个函数是被语法copy到Layer1对象中的(this的指向都被更换了)
他又怎么能知道num的存在的呢?

可能问题提的有点没水平,请大家见谅, 谢谢

haothing 2007-01-22

打赏
举报

this指的是运行时的对象也就是'Layer1' 而不是定义时的对象(Debug)

tjgjp 2007-01-22

打赏
举报

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js问题</title>
<style type="text/css">

</style>
</head>
<script>
function Debug(num){
this.num = num;
}this.out = function(){
alert(num);
//alert("dfdfdfsdfds");
}

var dbg = new Debug(555);
var gjp = "hello world";
</script>
<body>

<div id="Layer1" >clickme</div>
<script>
document.getElementById('Layer1').onclick = dbg.out;
</script>
</body>
</html>
我修改了一下你的Debug函数。其中
this.out = function(){
alert(this.num);
}
改为
this.out = function(){
alert(num);
}
就可以达到你要的结果了。具体原因是JS是this的用法和一般的面向对象的用法有不同的地方。
在JS中this就是引用函数级的。所以你用this.num在你的out函数中没有定义。所以显示时undefine.

wzhiyuan 2007-01-22

打赏
举报

你这样写
document.getElementById('Layer1').onclick = dbg.out;
实际执行时alert(this.num)中的this指的是Layer1,
下面这样写
document.getElementById('Layer1').onclick = function(){dbg.out();}
alert(this.num)中的this才指的是Debug的实例。

你可以将alert(this.num)改为alert(this.id)试一下就知道了。

shadowkiss 2007-01-22