Afficher ou retourner les options sélectionnées lors d’une sélection multiple à l’aide de jquery

Les gars, je crée un code qui va supprimer une option sélectionnée sur l’autre menu déroulant une fois sélectionné, j’ai utilisé jQuery (jQuery-1.10.1.min) mais je ne sais pas comment je pourrai retourner l’option ou le numéro choisi une fois que l’utilisateur change d’avis.

Pouvez-vous m’aider s’il vous plaît? Merci d’avance.

Voici mon script:

HTML

 None 01 02 03 04   None 01 02 03 04   None 01 02 03 04   None 01 02 03 04  

Javascript

 $(window).load(function(){ $('#question_order1').on('change', function() { var val=this.value; $("#question_order2").find("option:contains("+val+")").remove(); $("#question_order3").find("option:contains("+val+")").remove(); $("#question_order4").find("option:contains("+val+")").remove(); }); $('#question_order2').on('change', function() { var val=this.value; $("#question_order1").find("option:contains("+val+")").remove(); $("#question_order3").find("option:contains("+val+")").remove(); $("#question_order4").find("option:contains("+val+")").remove(); }); $('#question_order3').on('change', function() { var val=this.value; $("#question_order1").find("option:contains("+val+")").remove(); $("#question_order2").find("option:contains("+val+")").remove(); $("#question_order4").find("option:contains("+val+")").remove(); }); $('#question_order4').on('change', function() { var val=this.value; $("#question_order1").find("option:contains("+val+")").remove(); $("#question_order2").find("option:contains("+val+")").remove(); $("#question_order3").find("option:contains("+val+")").remove(); }); });//]]> 

Voici une solution qui stocke d’abord une copie de l’ html. Lors du changement d’un il crée un tableau de toutes les valeurs sélectionnées. Il reconstruit ensuite tous les autres à partir du code HTML stocké et filtre les valeurs autorisées.

 $(function () { var $quest = $('.question_order'); /* cache option html */ var optHtml = $quest.first().html(); $quest.on('change', function () { /* make array of all selected values*/ var selecteds=$quest.find('option:selected').map(function(){ if(this.value){ return this.value } }).get(); /* rebuild the other select elements*/ $quest.not(this).each(function(){ var selVal=this.value || ''; /* create new set of options with filtered values*/ var $opts=$(optHtml).filter(function(){ return $.inArray(this.value,selecteds) ==-1 || this.value ==selVal }); /* replace children*/ $(this).html($opts).val(selVal); }); }); }); 

Notez que class="question_order" ajouté à chaque élément.

DEMO

Essaye ça

     

Démo