Question

如果我们将onclick事件替换为onload，那么为什么灯泡会保持无限时间？这是示例from w3schools，只需用onload替换onclick并提交代码。

实施例： -

<!DOCTYPE html>
<html>
<body>
<script>
function changeImage() {
    element = document.getElementById('myimage')
    if (element.src.match("bulbon")) {
        element.src = "pic_bulboff.gif";
    } else {
        element.src = "pic_bulbon.gif";
    }
}
</script>

<img id="myimage" onload="changeImage()"
src="pic_bulboff.gif" width="100" height="180">

<p>Click the light bulb to turn on/off the light</p>

</body>
</html>

Answer 1

每次成功加载图像时，都会触发图像的onload事件。这意味着如果您更改src，则新图片将加载到<img>“容器”中，并在完成后触发onload（或onerror）

您必须删除事件处理程序。 this.onload = null;会做到这一点。（假设你在你的偶数处理程序中 - 在这种情况下，你需要onLoad="changeImage(); this.onload = null;"，或者在函数中调整你的代码。

Answer 2

粗略地说，

在“页面”上加载：

<body onload="...">

on“image”load：

<img onload="..." />

Answer 3

因为它无限加载新图像

只需添加

element.onload = undefined;

到你的功能

JS'onload'函数调用infine时间

3 个答案: