Come abilitare/disabilitare le opzioni nella casella di selezione usando jquery

Question

Ho una casella di selezione che contiene le opzioni e optgroup che vengono generate dinamicamente utilizzando php.Ora quando seleziono "TUTTI" tutte le altre optgroup, le opzioni devono essere disabilitate e quando seleziono qualsiasi opzione diversa da "TUTTI" l'opzione "TUTTI" deve essere disabilitata

<select name="select1" id ="select1" onchange="handleSelect()"> 
    <option value ="-1">ALL</option> 
    <optgroup label="CARS"> 
     <option value="ford">FORD</option> 
     <option value="Nissan">Nissan</option> 
    </optgroup> 
</select> 
<script> 
    function handleSelect() { 
     var selectVal = $("#select1:selected").text(); 
     if (selectVal == "ALL") { 
      // cannot disable all the options in select box 
      $("#select1 option").attr("disabled", "disabled"); 
     } 
     else { 
      $("#select1 option[value='-1']").attr('disabled', 'disabled'); 
      $("#select1 option").attr('disabled', ''); 
     } 
    } 
</script> 

Come posso farlo funzionare?

Answer 1

Questa è una specie di una cosa strana da fare, ma qui è il codice che soddisfi le vostre requisiti.

$('select').on('change', function() { 
    if (this.value == '-1') { 
     $('optgroup option').prop('disabled', true); 
    } else { 
     $('optgroup option').prop('disabled', false); 
    } 
}); 

diretta Esempio-http://jsfiddle.net/NpNFh/

Answer 2

È possibile utilizzare due varianti sulla sintassi per l'attributo disabili, a seconda della versione di HTML si prendono di mira:

HTML4: <option value="spider" disabled>Spider</option> 
XHTML: <option value="spider" disabled="disabled">Spider</option> 

Answer 3

è possibile utilizzare il seguente code.Let Consideriamo avete tre caselle di selezione come segue

<select class="sel_box" id="sel_1" onchange="disable_sel(this.value);" ></select> 
<select class="sel_box" id="sel_2" onchange="disable_sel(this.value);" ></select> 
<select class="sel_box" id="sel_3" onchange="disable_sel(this.value);" ></select> 

e in funzione di lasciare 'opt' è argomento ora utilizzare il seguente

$('.sel_box option[value="'+opt+'"]').attr("disabled", true);