выберите 1-й вариант в раскрывающемся списке мультигрупп с помощью jquery - PullRequest
Новая
       22

выберите 1-й вариант в раскрывающемся списке мультигрупп с помощью jquery

5 голосов
/ 17 августа 2011

У меня выпадающий список, очень похожий на этот: 

<select id='someSelect'>
    <option value="0">---select one---</option>
    <optgroup label="Bikes">
        <option value="B-4">Hayabusa</option>
        <option value="B-2">GSXR</option>
        <option value="B-3">Ninja</option>
        <option value="B-6">Enticer</option>
    </optgroup>
    <optgroup label="Cars"> 
        <option value="C-4">Audi TT</option>
        <option value="C-2">Awesome Car</option>
        <option value="C-23">Japanese car</option>
        <option value="C-9">German car</option>
    </optgroup>
</select>

Я просто хочу выбрать 1-й элемент 1-й группы (велосипеды здесь).Как мне это сделать в jQuery, пожалуйста?

В настоящее время я пробовал это: 

$('#someSelect option:nth-child(1)').attr("selected", "selected");

НО , проблема в том, что есть три 1-ых элемента (--select--, Hayabusa и Audi TT) он выбирает все три, которые в итоге выбирают Audi TT

Я пытался сделать некоторые вещи с помощью each и выбрать только второй, но потом понялчто раскрывающийся список является динамическим, я не хочу выбирать вариант по умолчанию (который равен --select one--), но первый элемент первой группы

Я пытался создать макет jsfiddle,но он испорчен и не работает, не знаю почему: - /
Вы можете увидеть это здесь

Ответы [ 7 ]

7 голосов
/ 17 августа 2011

Здесь является примером, а вот селектор, который я использовал: 

$("#someSelect optgroup option:first").attr("selected", "selected");

Как видите, я использовал первый вариант, заглянув внутрь элемента optgroup.

4 голосов
/ 17 августа 2011

выбор из группы выбора вместо выбора: 

$('optgroup[label=Bikes] option:first')

Или, если вы не хотите указывать метку, просто отфильтруйте также в optgroup: 

$('optgroup:first option:first')
4 голосов
/ 17 августа 2011

Ну, это работает:

http://jsfiddle.net/nYd67/1/

$(function(){
    $('#someSelect optgroup:eq(0) option:eq(0)').attr("selected", "selected");
});
3 голосов
/ 17 августа 2011

Просто включите optgroup в ваш селектор: 

$('#someSelect optgroup:nth-child(2) option:nth-child(1)')

Просто помните, что селектор :nth-child() основан на 1, а не на 0.Кроме того, в этом случае вам даже не нужно указывать селектор с именем тега, поэтому он также может быть просто: 

$('#someSelect :nth-child(2) :nth-child(1)')
2 голосов
/ 17 августа 2011 
$('#someSelect optgroup:first option:first').attr('selected', true);

это работает, я проверил на вашем HTML

2 голосов
/ 17 августа 2011

Я всегда нахожу, что .eq() намного проще в использовании. Кажется, это работает правильно в вашем jsfiddle. 

$('#someSelect option').eq(1).attr("selected", "selected");
1 голос
/ 17 августа 2011

Селектор для первого option в первом optgroup элемента select с идентификатором someSelect: 

"select#someSelect > optgroup:nth-child(1) > option:nth-child(1)"
...