Two-level javascript missing image?

Question

I am trying to update a webpage that already has a bit of javascript in it to replace a missing image. The way it works right now is it looks for pcp.gif, and if not found displays an error message image instead. (Just like in this thread)

<p align = center><img src = PCP.gif onerror = "this.onerror=null;this.src='!FireSeasonOnly.gif';">

What I want it to do now is look for pcp.png, if not found display pcp.gif and if BOTH are not found then display the error message image. I'm not having any luck getting the second level to work. I tried wrapping it in an IF but it didn't work the way I was hoping.

<p align = center><img src = pcp.png onerror = "if (this.src='pcp.png') {this.onerror=null;this.src='pcp.gif';} else {this.onerror=null;this.src='!FireSeasonOnly.gif';} ">

The above doesn't work. If the PNG is present, it displays it. If not, it displays the GIF if present. But if both are missing, I get the broken image icon, so it's not hitting my else statement. Any suggestions?

Try `onerror="this.src = (this.src === 'pcp.gif') ? '!FireSeasonOnly.gif' : 'pcp.gif'"` — floribon, May 14 '15 at 18:26
Okay, Bhawin... I put quote marks around it but that didn't change anything. — Beverley M, May 14 '15 at 18:26
floribon, I tried that but I got the same result. It would drop down to the pcp.gif but not to FireSeasonOnly. No effect deleting whitespace, marekful. — Beverley M, May 14 '15 at 18:31
argh. I threw in an alert, and it looks like the value in this.src is NOT just what is in the src tag, but the fully qualified name including server. — Beverley M, May 14 '15 at 18:48
I've got a working answer now but when I try to post it, I'm getting "an error occurred during comment submission"... would like to post the full details for future people with same problem! — Beverley M, May 14 '15 at 18:56

score 0 · Answer 1 · answered May 14 '15 at 18:56

0

Here's the working answer -- thank you for your help, all, especially floribon!

onerror="this.src=(this.src === location.protocol + '//' + location.host + '/Weather/Maps/pcp.gif') ? '!FireSeasonOnly.gif' : 'pcp.gif';"

answered May 14 '15 at 18:56

Beverley M

3
2

For some reason it won't let me enter the full code. – Beverley M May 14 '15 at 18:58

Two-level javascript missing image?

1 Answers1