在操作发生之前触发Javascript事件

我正在尝试编写一个脚本，这样当我播放一个嵌入的声音对象时，我嵌入的图片也会改变

function changePic() {
document.getElementById("sound").onclick = transform(document.getElementById("pic"));
}
    
function transform (pic) {
pic.src = "";
alert ("done");
}

---

问题是，当我加载页面时，Javascript代码会自动运行，即使我没有在声音对象上单击播放（

autostart

设置为false）。有人知道是什么导致了这种情况吗？

当您编写

onclick=transform（…）

时，您正在调用

transform

并将结果分配给

onclick

您需要将处理程序设置为调用

transform

的匿名函数，如下所示：

document.getElementById("sound").onclick = function() {
    transform(document.getElementById("pic"));
};

但是，这是添加事件的错误方式。

---

您应该调用

元素.addEventListener

/

元素.attachEvent

。（或者只使用jQuery）

编写

onclick=transform（…）

时，调用

transform

并将结果分配给

onclick

您需要将处理程序设置为调用

transform

的匿名函数，如下所示：

document.getElementById("sound").onclick = function() {
    transform(document.getElementById("pic"));
};

但是，这是添加事件的错误方式。

---

您应该调用

元素.addEventListener

/

元素.attachEvent

。（或者只使用jQuery）

当您执行

changePic（）

时，还应该附加如下事件：

元素。addEventListener

和

元素。attachEvent

在IE中。当您执行

changePic（）

时，您还应该附加这样的事件：

element.addEventListener

和IE中的

element.attachEvent

。