입력 순서 선택

Question

그래서 3 개의 입력 필드가 있으며, 일단 선택되면 다른 옵션을 비활성화 할 수 있는지 궁금합니다. 예 :

<tr id="row1"> 
    <th>Row 1</th> 
    <td> 
     <select> 
      <option value="1">1</option> 
      <option value="2" selected>2 selected so 1+3 are disabled</option> 
      <option value="3">3</option> 
     </select> 
    </td> 
</tr> 

<tr id="row2"> 
    <th>Row 2</th> 
    <td> 
     <select> 
      <option value="1" selected>1 selected 2+3 are disabled</option> 
      <option value="2">2</option> 
      <option value="3">3</option> 
     </select> 
    </td> 
</tr> 

<tr id="row3"> 
    <th>Row 3</th> 
    <td> 
     <select> 
      <option value="1">1</option> 
      <option value="2">2</option> 
      <option value="3" selected>3 (you get it...)</option> 
     </select> 
    </td> 
</tr> 

Answer 1

이 시도 :

$('select').change(function(){ 
    $(this).find('option:not(:selected)').prop('disabled', true) 
}) 

Demo

Answer 2

당신은 선택에 onchange를 이벤트를 바인딩 할 수 있습니다. 그런 다음 선택되지 않은 옵션 요소를 선택하고 사용하지 않도록 설정하십시오. 이미 jQuery를 잘 알고 있다면, 당신은이 방법을 수행 할 수 있습니다 :

$("select").bind("change", function(){ 
     $(this).children("option:not(:selected)").attr("disabled", "disabled"); 
    }); 

Answer 3

어쨌든 자신의 선택을 변경하는 사용자를 방지 할 다른 옵션을 사용하지 않도록, 그래서 그냥 다른 모든 옵션을 제거하기 위해 자바 스크립트를 사용합니다.

빠른 더러운 방법은 없음 JQuery와 필요하지

<select onchange='for(vari=0, l=this.options.length; i<l; i++){ if(this.options[i].selected) continue; this.remove(i); }'> 

될 것이다. 그러나, 나는 당신이 inmport 할 수있는 다른 외부 자바 스크립트가없는 한 이러한 javascript와 html을 섞어서 사용하지 않을 것입니다. 그리고 이것을 특정 select 문에 대한 핸들러로 적용하십시오.