Marque Valeur en DROPDOWNLIST ne peut être sélectionné

Question

J'ai créé un dropdownlist qui ressemble un peu à ceci:

Item1 
    Item2 
    Item3 
Item4 
    Item5 
    Item6 
    Item7 

Je voudrais faire Item1 et Item4 que les éléments non sélectionnables. Est-ce possible avec Jquery?
LaterEdit: Je devrais être en mesure de sélectionner item1 et item4 (événements) à travers ma classe appelée fooheader et le reste des éléments sélectionnables sont appelés par la classe fooDetails.

Au moment de mon correctif temporaire rend la prochaine valeur de la dll la valeur sélectionnée, mais je suis à la recherche d'une solution plus élégante à la question

Answer 1

Vous devez utiliser <optgroup> ...

<select> 
    <optgroup label="Item 1"> 
    <option>Item 2</option> 
    <option>Item 3</option> 
    </optgroup> 
    <optgroup label="Item 4"> 
    <option>Item 5</option> 
    <option>Item 6</option> 
    <option>Item 7</option> 
    </optgroup> 
</select> 

est ici un jsFiddle ...

http://jsfiddle.net/DKLwv/

Si vous ne voulez pas les imbriquer, fais comme ça ...

<select> 
    <optgroup label="Item 1"></optgroup> 
    <option>Item 2</option> 
    <option>Item 3</option> 
    <optgroup label="Item 4"></optgroup> 
    <option>Item 5</option> 
    <option>Item 6</option> 
    <option>Item 7</option> 
</select> 

Answer 2

essayer cette

<select> 
<option value="" disabled>---------------------</option> 

</select> 

Answer 3

Emm .. J'ai finnaly finnished cette partie .. J'ai eu quelques problèmes avec la modification de ma mise DDL l'option à plusieurs champs dans ma liste déroulante. Ce est ma solution, peut-être il aide quelqu'un d'autre (et moi obtient quelques upvotes supplémentaires dans le processus: P)

var $groups = $("#ddlId").filter(function() { 
     return $(this).css('color') == 'rgb(0, 0, 0)'; // your condition of finding the optgroup elements 
    }); 
    $groups.each(function() { 
     var $this = $(this); 
     $this.nextUntil($groups).wrapAll($("<optgroup>", { 
      label: $this.text() 
     })).end().remove(); 
    });