Question

The code is here:

http://jsfiddle.net/jf7t2/1/

Please run it on the latest versions of all browsers, and see for yourself. When the button is clicked, on:

1. on Chrome (and Safari of course) it just doesn’t select anything, instead creates some ghostly empty option
2. on Firefox and Opera, it works the way I expect and want it to work, de-selects all options
3. on Internet Explorer, it does nothing

So, which one is the expected behaviour?

Answer 1

If you look at the jQuery 1.5.1 source code line 1970 you’ll see this:

// Treat null/undefined as ""; convert numbers to string
if ( val == null ) {
    val = "";

So the expected behavior is the same as if you gave the empty string as argument.

If you continue to line 1984 you’ll see this:

} else if ( jQuery.nodeName( this, "select" ) ) {
  var values = jQuery.makeArray(val);

  jQuery( "option", this ).each(function() {
    this.selected = jQuery.inArray( jQuery(this).val(), values ) >= 0;
  });
  if ( !values.length ) {
   this.selectedIndex = -1;
  }

So the expected behaviour is:

1. if there is an option with an empty string value, choose that.
2. if not set selectedIndex = -1

From here on it is up to the browser to determine what to do if selectedIndex is set to -1

Looking at the msdn library it says:

The selectedIndex property returns -1
if a select object does not contain
any selected items. Setting the
selectedIndex property clears any
existing selected items.

So in ie the expected behavior seems to be that it will de-select all options

The same goes for the MDC documentation and thus firefox, where theya re very explicit about it

Returns the index of the currently
selected item. You may select an item
by assigning its index to this
property. By assigning -1 to this
property, all items will be
deselected.

It seems webkit based browsers have a different take on things.

If you google “webkit selectedIndex” you will see quite a few bug report regarding the select tag, so maybe it’s just funky 😉

Come to think of it, this is a bug in jQuery since it is a library that should be able to behave the same across browsers – it should be reported 😉