Vous voulez quelque chose de ce genre - Exemple de Code ici
$(function() {
$("input:radio[@name='abc123']").click(function() {
if($(this).attr('id') == 'abc') {
// Disable 123 and Enable abc
$("#theOptions option[value='1']").attr("disabled","disabled");
$("#theOptions option[value='2']").attr("disabled","disabled");
$("#theOptions option[value='3']").attr("disabled","disabled");
$("#theOptions option[value='a']").attr("selected","selected");
$("#theOptions option[value='a']").attr("disabled","");
$("#theOptions option[value='b']").attr("disabled","");
$("#theOptions option[value='c']").attr("disabled","");
} else {
// Disable abc's and Enable 123
$("#theOptions option[value='a']").attr("disabled","disabled");
$("#theOptions option[value='b']").attr("disabled","disabled");
$("#theOptions option[value='c']").attr("disabled","disabled");
$("#theOptions option[value='1']").attr("selected","selected");
$("#theOptions option[value='1']").attr("disabled","");
$("#theOptions option[value='2']").attr("disabled","");
$("#theOptions option[value='3']").attr("disabled","");
}
});
});
EDIT:
Version améliorée du code, en utilisant l'expression régulière à des options de filtrage basé sur les valeurs de l'option. Exemple de travail ici. Vous pouvez modifier l'exemple par l'ajout d' /edit de l'URL
$(function() {
$("input:radio[@name='abc123']").click(function() {
// get the id of the selected radio
var radio = $(this).attr('id');
// set variables based on value of radio
var regexDisabled = radio == 'abc' ? /[1-3]/ : /[a-c]/;
var regexEnabled = radio == 'abc' ? /[a-c]/ : /[1-3]/;
var selection = radio == 'abc' ? 'a' : 1;
// select all option elements who are children of id #theOptions
$("#theOptions option")
// filter the option elements to only those we want to disable
.filter( function() { return this.value.match(regexDisabled);})
// disable them
.attr("disabled","disabled")
// return to the previous wrapped set i.e. all option elements
.end()
// and filter to those option elements we want to enable
.filter( function() { return this.value.match(regexEnabled);})
// enable them
.attr("disabled","");
// change the selected option element in the dropdown
$("#theOptions option[value='" + selection + "']").attr("selected","selected");
});
});
EDIT 2:
Depuis le désactivé attribut ne fonctionne pas de manière fiable, sur tous les navigateurs, je pense que votre seule option est de supprimer l'option éléments ne sont pas nécessaires lorsqu'un bouton radio est sélectionné. Exemple de travail ici
$(function() {
$("input:radio[@name='abc123']").click(function() {
// store the option elements in an array
var options = [];
options[0] = '<option value="1">1</option>';
options[1] = '<option value="2">2</option>';
options[2] = '<option value="3">3</option>';
options[3] = '<option value="a">a</option>';
options[4] = '<option value="b">b</option>';
options[5] = '<option value="c">c</option>';
var radio = $(this).attr('id');
var regexEnabled = radio == 'abc' ? /[a-c]/ : /[1-3]/;
// set the option elements in #theOptions to those that match the regular expression
$("#theOptions").html(
$(options.join(''))
// filter the option elements to only those we want to include in the dropdown
.filter( function() { return this.value.match(regexEnabled);})
);
});
});
ou même
$(function() {
// get the child elements of the dropdown when the DOM has loaded
var options = $("#theOptions").children('option');
$("input:radio[@name='abc123']").click(function() {
var radio = $(this).attr('id');
var regexEnabled = radio == 'abc' ? /[a-c]/ : /[1-3]/;
// set the option elements in #theOptions to those that match the regular expression
$("#theOptions").html(
$(options)
// filter the option elements to only those we want to include in the dropdown
.filter( function() { return this.value.match(regexEnabled);})
);
});
});
