Если вы предоставляете своим opt-группам класс, вы можете выбрать класс и получить доступ к его дочерним элементам.
$('.german-cars').children();
Если это недоступно, альтернатива будет немного медленной.Когда вы перебираете все группы опций и сравниваете их текст по отдельности, то выбираете их потомками.
edit : исправить селектор.И уточнение:
Затем, чтобы выбрать их по щелчку, вы будете использовать:
$('.german-cars').click(function(e) {
e.preventDefault();
$(this).children().attr('selected', 'selected');
});
Предполагая, что элемент установлен для множественного выбора.В противном случае будет выбран только последний автомобиль в списке.
РЕДАКТИРОВАТЬ 2
Fiddle: http://jsfiddle.net/mbChZ/25/
Эти изменения должны работать так, как выищем.
$(function() {
$('select optgroup').mousedown(function(e) {
e.preventDefault();
if ($(this).children(':selected').length == $(this).children().length) {
$(this).children().attr('selected', null);
} else {
$(this).children().attr('selected', 'selected');
}
});
$('select option').mousedown(function(e) {
e.stopPropagation();
e.preventDefault();
$(this).attr('selected', ($(this).is(':selected'))? null : 'selected');
});
});
Я изменил события на mousedown, чтобы мы могли видеть состояние элементов до того, как браузер уже обработал событие mousedown.Это позволяет нам проверить, все ли они выбраны, и если это так, отмените выбор, а не выберите.И то же самое должно было быть сделано для события click option
, чтобы оно могло предотвратить распространение на этом событии.
Я не уверен на 100% в совместимости браузера на этом, хотя вы можете захотетьчтобы убедиться, что он работает в старых IE, если вы поддерживаете их.