Valeurs de liste déroulante dans jquery

Question

J'ai deux listes déroulantes avec la liste des éléments 2 et 6 respectivement. Lorsque je sélectionne premier élément de menu déroulant, la liste des éléments en deuxième sera 6 et lorsque je sélectionne une autre valeur dans le premier menu déroulant, la liste des articles devrait être 5 dans le deuxième menu déroulant,

S'il vous plaît trouver le code ici:

<select id="firstdropdown"> 
    <option value="1">Test</option> 
    <option value="2">Testing</option> 
</select> 
<select id="seconddropdown"> 
    <option value="1">test1</option> 
    <option value="2">test2</option> 
    <option value="3">test3</option> 
    <option value="4">test4</option> 
    <option value="5">test5</option> 
    <option value="6">test6</option> 
</select> 

Quelqu'un peut-il me proposer une solution en jquery ou javascript?

Answer 1

Quelque chose comme ceci:

$("#firstdropdown").change(function() { 
    if(this.value === "1") $("#seconddropdown").val("6"); 
    else $("#seconddropdown").val("5"); 
}) 

---

EDIT: a ajouté un jsFiddle: http://jsfiddle.net/scaillerie/WGhLA/

Answer 2

Vous pouvez le faire de cette façon, je suppose que vous voulez afficher/masquer last élément. vous pouvez le changer à votre désiré en donnant index.

Live Demo

$('#firstdropdown').change(function(){ 
    if($(this).val() == "2") 
     $('#seconddropdown option:eq(5)').hide(); 
    else 
     $('#seconddropdown option:eq(5)').show(); 
});​ 

Answer 3

De ma compréhension que vous supprimez un élément pour une deuxième option de la première liste déroulante

$("#firstdropdown").change(function() { 
    if(this.value === "2") $("#seconddropdown option:last").remove(); 
    //here you are just removing last item  
}) 

Answer 4

Si vous avez besoin de cacher un élément dans le menu déroulant, vous venez besoin de changer l'indice de 'eq'

$('#firstdropdown').change(function(){ 
    if($(this).val() == "2") 
     $('#seconddropdown option:eq(3)').hide(); // change the index of 'eq' 
    else 
     $('#seconddropdown option:eq(3)').show(); 
    });​