jQuery obtenir sélectionné VALEUR menu déroulant

Question

Je suis en train d'obtenir la valeur sélectionnée et menu déroulant effectuer une slideDown sur la DIV qui a l'option VALEUR:

$(function() 
{ 
    $('#show-options').change(function(){ 
     $('#show-options').val().slideDown(); 
     return false; 
    }); 
}); 

<select id="show-options"> 
    <option value="">Select an Option</option> 
    <option value="vehicle-type">Vehicle Type</option> 
    <option value="vehicle-colour">Vehicle Colour</option> 
</select> 

<div id="vehicle-type" style="display: none;"> 
    ... 
</div> 

<div id="vehicle-colour" style="display: none;"> 
    ... 
</div> 

Cela ne semble pas fonctionner. EDIT: Aussi, une fois qu'une option particulière a été sélectionnée, elle doit être supprimée de la liste déroulante et la liste déroulante doit être focalisée sur l'option supérieure ("Sélectionner une option").

EDIT 2: Une fois qu'une option particulière a été sélectionnée, la liste déroulante devrait se déplacer sous la nouvelle DIV affichée (ou la nouvelle DIV devrait être placée au-dessus de la liste déroulante).

EDIT 3: Ces div cachés contiennent des éléments de formulaire (cases à cocher ou listes déroulantes). Par défaut, j'ai mis ces éléments de formulaire à "désactivé". Quand un DIV est affiché, il doit rendre ces éléments de formulaire "activés". Idéalement, je veux qu'il recherche tous les éléments de formulaire qui sont dans ce div (il peut y en avoir plus d'un), plutôt que de spécifier exactement les éléments de formulaire à cibler.

EDIT: I figured it out:

$('#' + $(this).val() + ' :input').removeAttr('disabled'); 

EDIT 4: Une fois que le formulaire a été soumis, qui ont été les DIVs affichés avant la soumission doivent être affichées automatiquement. Je peux vérifier les variables GET dans mon PHP mais j'ai besoin du code jQuery qui imitera la fonction 'change' - je pense que cela a quelque chose à voir avec les triggers ou les binds.

Answer 1

Essayez:

$('#' + $(this).val()).slideDown(); 

EDIT :

Pour supprimer l'option actuellement sélectionnée, utilisez:

if ($(this).val()) { 
    $(this).find('option:selected').remove(); 
} 

La sélection retournera automatiquement à l'option supérieure.

EDIT 2:

var $this = $(this), 
    val = $this.val(); 

if (val) { 
    $('#' + val).slideDown().insertBefore(this); 
    $this.find('option:selected').remove(); 
} 

Answer 2

$('#show-options').val()$('#show-options').val() renvoie une chaîne - dans ce cas, c'est également la même chose que $ (this). Vous devez envelopper cela dans un sélecteur jQuery pour le faire fonctionner (ainsi que l'utilisation d'un sélecteur id):

var selectedOption = $(this).val(); 
$("#" + selectedOption).slideDown(); 

Exemple: http://jsfiddle.net/jonathon/3S8kZ/

Answer 3

$('#show-options').change(function(){ 
    $('#' + $(this).val()).slideDown(); 
    return false; 
});