Image complete property prematurely true?

[Weston]

I've been playing around with some means of testing image loading, and
noticing that the "complete" property seems to default to true. Trying
the following in the squarefree javascript shell:

I = new Image();
I.complete

yields "true".

Seems a bit odd -- obviously there's no src given yet, so is it
really complete? Is this behavior defined that way on purpose? If so,
what's the justification?

 

[Weston]

Weston said the following on 4/2/2007 11:49 AM:




Run it in IE7, it gives false.

Interesting. I should have specified... Camino 1 and Firefox 2 yield
true. Safari doesn't seem to run the squarefree shell, but using the
Mochikit Interpreter (http://mochikit.com/examples/interpreter/
index.html ) also yields true.

Can you verify that with IE7, once you specify a valid image url for
the src property, complete switches to true?

Can anyone verify that IE6 does the same?

Why not use the onload event of the image?

That's probably the path I'll end up taking for the practical
application of this investigation -- this line of investigation is
mostly curiousity. But since we're talking about it: are the onload /
onerror handlers part of a specific standard, or even just pretty
consistent across browsers?

I've also been looking at testing against the default value of the
"width" property (-1 in Moz/Gecko, 0 in Safari). Not ideal in a number
of situations, given that there could well be lagtime between where
the test is interpreted and the load of the image, but like the
complete property, it seems be more convenient in branches of code
where you're sure the image should already have been loaded if it was
going to load at all.

 

[Weston]

Can you verify that with IE7, once you specify a valid image url for
the src property, complete switches to true?

I've just verified this from a friend -- IE7 will switch complete to
true once you give it a good src (forgot to have him verify that
complete remains false if it can't load the given URL, tho').

... are the onload / onerror handlers part of a specific standard,
or even just pretty consistent across browsers?

I've just checked, and onerror doesn't seem to work in Safari. This
code:

I = new Image()
I.onerror = function () { alert('failure'); }
I.onload = function () { alert('loaded'); }
I.src = 'http://bogus.fak/fake.jpg'

results in the 'loaded' alert coming up.

This means you have to run a check in the onload function... and since
it can't be "complete", it's probably going to have to be something
like checking the default image width value against the loaded image
value.