0

我有一个这样的 Html 文件：

<!doctype html>


<head>
<title></title>

<link rel="stylesheet" type="text/css" href="style/boxClass.css" />
<script type="text/javascript">

/* lightBox class */

function box (id1,id2) {
    this.boxBackgroundDiv = document.getElementById (id1);
    this.boxWorkAreaDiv   = document.getElementById (id2);
}

lightBox.prototype.setBackgroundColor = function(c) {
    this.boxBackgroundDiv.style.backgroundColor = c;
    alert('Hello back');
};



function init (id1,id2)
{
   boxObj = new box (id1,id2);
   alert ("Hello");
}

</script>
</head>
<body onload="init('box1','box2')">
<div id="lightbox1" class="boxBackground">I am here</div>
<div id="lightbox2" class="boxWorkArea"><button onclick="boxObj.setBackgroundColor('Red')">I am here</button></div>

</body>
</html>

现在，当我按照这段代码中的方式调用我的 init 函数时，它可以正常工作。但是，如果我通过 window.onload 执行以下操作，它就不起作用。在这种情况下，它无法获取 div id。但是我需要 div id 来为我的班级创建 objs。

<!doctype html>


<head>
<title></title>

<link rel="stylesheet" type="text/css" href="style/boxClass.css" />
<script type="text/javascript">

/* lightBox class */

function box (id1,id2) {
    this.boxBackgroundDiv = document.getElementById (id1);
    this.boxWorkAreaDiv   = document.getElementById (id2);
}

lightBox.prototype.setBackgroundColor = function(c) {
    this.boxBackgroundDiv.style.backgroundColor = c;
    alert('Hello back');
};



function init (id1,id2)
{
   boxObj = new box (id1,id2);
   alert ("Hello");
}
window.onload = init ("box1",box2);
</script>
</head>
<body>
<div id="lightbox1" class="boxBackground">I am here</div>
<div id="lightbox2" class="boxWorkArea"><button onclick="boxObj.setBackgroundColor('Red')">I am here</button></div>

</body>
</html>
4

1 回答 1

1

两个问题：

1）您在 box2 参数周围缺少引号，

2）您正在将 init 函数的返回值（这里是一个 void）分配给 window.onload 处理程序。

您应该按如下方式分配 onload 处理程序：

window.onload = function(){
 init ("box1","box2");
}
于 2012-07-03T18:05:20.583 回答