JavaScript: How to make an image change from a listbox selection?

Question

I've been working for weeks on this project, and I've pretty much exhausted my internet research, and I cannot figure out how to make a listbox selection change an image on my page. I have the code that appears that it SHOULD work, but when I test it, nothing happens! This is the code I've written so far, can anyone help me figure out what exactly I'm doing wrong?

(will edit the code in)

Please select a vehicle from the list
Car One
Car Two
Car Three

Hmm, yeah, I tried that too. It's not set into a form though, so document.[object] should cover it in hierarchy, I would think. I did try putting it INTO a form though, too. No luck. :(

Answer 1

the way you are writing the code it will only work in IE.

you can't get to an image or anything else directly from document!

you can get there in every browser with document.getElementById('anyid')
after you code the img with

so the src will update!

I suggest you debug your javascript with a browser that shows reasonable errors, like firefox!

If you want better errors, you need firefox, if you need more, there's a plug in called firebug that can assist you even more!

Answer 2

The built-in object reference 'this' (no quotes) is available within event handlers. If you actually need a reference to the form object (and the select element is inside of a form, of course) you could use this.form, but it looks like passing this.selectedIndex from the event handler [anonymous code] to your fucntion would do nicely.

(The space between 'selected' and 'Index' was necessitated by some idiotic fixup that this composition page imposed.)

Now if the image was a child of the form, there would be some benefit in passing the form object... but if that would compromise your design, then I agree completely with the other poster that suggested assigning an id attribute.

I would, however, disagree with that same post as to the best environment for debugging, Microsoft/IE is vastly superior in that realm, object-level debugging using any of at least half-a-dozen MS environments is almost infinitely more robust than FF armed with every add-on in the world for it.

2007-03-12 03:36:48 · answer #2 · answered by Random Malefactor 5 · 1⤊ 0⤋

I think I might see the problem...

Generally when you set objects to different values in your page you refer to document.[formname].[objectname].property.

So try changing document.carPicture.src to document.[formname].carPicture.src.

2007-03-12 00:00:40 · answer #3 · answered by rowancompsciguy 3 · 1⤊ 1⤋

fedest.com, questions and answers

Answer 3

I think I might see the problem...

Generally when you set objects to different values in your page you refer to document.[formname].[objectname].property.

So try changing document.carPicture.src to document.[formname].carPicture.src.