Non-selectable Drop Down List

Is there any way to have a drop-down list in which non of the items are selectable? So basically, I'm just looking to use it as a way of showing/hiding a list. I don't want any hov

Solution 1:

The optgroup tag comes to mind. It has a disabled attribute.

<select>
  <optgroup label="My List" disabled>
    <option value="item1">Item 1</option>
    <option value="item2">Item 2</option>
  </optgroup>
</select>​

However, IE 6 and 7 don't respect the disabled. Arrgh. Neither do they listen to the readonly attribute slapped on the whole select.

You will have to add a onchange="this.value ='item1';" fallback for those browsers, which obviously isn't watertight if JavaScript is turned off.

JSFiddle here

Solution 2:

Is there any way to have a drop-down list in which non of the items are selectable?

I have same requirement So I did like this,

<select >
    <option value="item1" disabled>Item 1</option>
    <option value="item2" disabled>Item 2</option>
    <option value="item3" disabled>Item 3</option>
    <option value="item4" disabled>Item 4</option>
</select>

On JsFiddle