come abilitare / disabilitare una casella di controllo in base alla selezione in più riquadri: javascript, jquery, html, forms

Ho una casella combinata multi selezione e una casella di controllo in un modulo.

Vorrei che la casella di controllo fosse abilitata solo quando l'utente seleziona un valore particolare dalla casella combinata multi selezione.

È possibile farlo ... tramite javascript o jQuery. Sto già usando jquery altrove.

Esempio: http://jsbin.com/ipomu

per cominciare con la casella di controllo sarà disabilitato. dovrebbe essere abilitato solo quando l'utente fa clic sull'opzione 2

risposte:

3 per risposta № 1

Un esempio. È sufficiente aggiungere i valori delle opzioni per i quali si desidera abilitare la casella di controllo sull'oggetto array. Nel seguente esempio ho abilitato la casella di controllo al clic su 2, 3,5 e 7 opzioni.

<script type="text/javascript">
$(function(){
var arrVal = [ "2","3", "5", "7" ];

$("#combobox").change(function(){
var valToCheck = String($(this).val());

if ( jQuery.inArray(valToCheck,arrVal) == -1 )
{
$("#check").attr("disabled", "true");
}
else
{
$("#check").removeAttr ( "disabled" );
}
});
});
</script>
<select id="combobox" size="9" id="reasons" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
<option value="6">Option 6</option>
<option value="7">Option 7</option>
</select>

Demo di lavoro per il tuo esempio.

---

1 per risposta № 2

Ho aggiornato il collegamento jsbin fornito con il jQuery appropriato necessario per ottenere l'effetto desiderato.

http://jsbin.com/ipomu/2

---

0 per risposta № 3

Puoi abilitare / disabilitare un elemento html tramite javascript con:

document.getElementById("<the id of your checkbox here>").disabled = true;

Quindi, devi aggiungere l'evento OnChange della tua casella combinata multi-selezione e aggiungere la logica in alcune funzioni quando disabilitare / abilitare la tua casella di controllo. Esempio:

<select onChange="myfunc(this)">

...

<script>
function myfunc(sel)
{
if (sel.selectedValue == "2")
document.getElementById("<the id of your checkbox here>").disabled = true;
}
</script>

---

0 per risposta № 4

Più semplicemente, con Javascript diretto e senza jQuery, è possibile aggiungere quanto segue onchange attributo al select element (supponendo che gli elementi siano entrambi circondati dalla stessa forma):

onchange="this.form["mycheck"].disabled = (this.value != 2)"

Se non sono nella stessa forma o se non si conosce il nome dell'elemento desiderato o gli elementi vengono creati dinamicamente, il .disabled = (this.value != 2) sarà lo stesso, ma il metodo per trovare la casella di controllo corretta potrebbe essere diverso.

---