Javascript debugging: IE Option gotcha
13th December 2003
I’ve been debugging Javascript today. I like Javascript as a language, but I doubt anyone would disagree that it’s a horrible, horrible language to debug across multiple browsers. Firebird at least has good debugging support—I currently use the Javascript Console and Jesse Ruderman’s shell bookmarklet and I really need to learn to use Venkman some day. If anyone knows a better way of debugging Javascript in IE than relying on the lame popup box I’d love to hear about it.
In any case, one bug that I successfully vanquished today involved the humble <option>
element. My HTML looked something like this:
<select name="categories" multiple="multiple" id="catfrom" size="20">
<option>entertainment</option>
<option>movies</option>
<option>sports</option>
<option>news</option>
</select>
I was having all kinds of strange problems in IE, which I finally tracked down to the following gotcha: in IE, the value property of an Option object is empty if the corresponding option tag doesn’t have a value attribute. This is counter-intuitive because in HTML if an option attribute is omitted the text inside the option element is used as the value instead. Mozilla browsers duplicate this in their handling of the Option object; IE doesn’t. Hopefully this tip will save someone some debugging time in the future.
Update: David Lindquist pointed me to Microsoft’s free Script Debugger.
More recent articles
- AI assisted search-based research actually works now - 21st April 2025
- Maybe Meta's Llama claims to be open source because of the EU AI act - 19th April 2025
- Image segmentation using Gemini 2.5 - 18th April 2025