Delete onload event handler initiated at img tag level?

[Tuxedo]

Is there a way to reliably remove an onload event that has been initiated
at the img tag level?

For example, the following would repeat the replacement indefinitely as the
image is replacing itself with itself:

function replace(){
document.getElementById("photo").src="pic2.jpg";
// delete onload???
}
<img src="pic1.jpg" onload="replace()" id="photo">

Is there way to effectively remove the event while having the onload event
handler in the image tag as above so it only happens once?

Maybe something like:
delete document.getElementById("photo").onload; // ???

Many thanks for any advise.
Tuxedo

[Martin Honnen]

Tuxedo wrote:

> For example, the following would repeat the replacement indefinitely as the
> image is replacing itself with itself:
>
> function replace(){
> document.getElementById("photo").src="pic2.jpg";
> // delete onload???
> }
> <img src="pic1.jpg" onload="replace()" id="photo">
>
> Is there way to effectively remove the event while having the onload event
> handler in the image tag as above so it only happens once?
>
> Maybe something like:
> delete document.getElementById("photo").onload; // ???

I would use

function replace(img, imgUrl) {
img.onload = null;
img.src = imgUrl;
}

<img src="pic1.jpg" onload="replace(this, 'pic2.jpg');" alt="...">


--

[Tuxedo]

Thanks for this neat solution, which can work similarly with
getElementById() but not with 'this' keyword. Either way, no need for the
delete operator.

Tuxedo