jQuery를 사용하여 여러 개의 드롭 다운에서 중복 값을 방지하는 방법

Question

사용자가 환경 설정을 선택할 수있는 5 개의 드롭 다운 메뉴가 있습니다. 모든 드롭 다운에는 동일한 선택 항목이 있습니다. 사용자가 드롭 다운 1의 값을 선택한 경우 해당 드롭 다운에 해당 옵션을 사용할 수 없어야합니다. 마지막으로 드롭 다운 할 때 선택할 수없는 옵션이 4 개 있어야합니다.

이것은 link에서 수행 된 것과 유사합니다. 하지만 이제 우리는 2 번 이상 드롭 다운을했습니다.

(For illustration, I show three dropdowns only)  

<select id="_go"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

<select id="_gogo"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

<select id="_gogogo"> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

아래 코드

는 있지만 주목할 이상 2.

var $select = $("select[id$='go']"); 
$select.change(function() { 
    $select 
     .not(this) 
     .find('option') 
     .prop('disabled', '') 
     .filter('[value='+this.value+']') 
     .prop('disabled','disabled'); 
}); 
$select.eq(0).trigger('change'); 

나는 것은 두 개의 드롭 다운을 위해 잘 작동 사용자가 실수로 드롭 다운 중 하나에 대한 잘못된 옵션을 클릭 할 수 있다는 것이다 , 사용자가 다시 선택하면 원래 값을 다시 사용해야합니다.

길을 제안 해주세요. 미리 감사드립니다. 다른 선택 필드

demo

$(".go").change(function(){ 
    var selVal=[]; 
    $(".go").each(function(){ 
     selVal.push(this.value); 
    }); 

    $(this).siblings(".go").find("option").removeAttr("disabled").filter(function(){ 
     var a=$(this).parent("select").val(); 
     return (($.inArray(this.value, selVal) > -1) && (this.value!=a)) 
    }).attr("disabled","disabled"); 
}); 

$(".go").eq(0).trigger('change'); 

에서 그들을 해제 할 수 있도록

Answer 1

대신 바로 옵션의 상태를 변경하는, 먼저, 선택 필드에서 현재 값을 얻을 필요 위의 코드는 여러 상자의 선택 상자와 함께 사용할 수 있습니다.