Используя jQuery, выберите следующий блок <select>и измените его значение - PullRequest
Новая
       8

Используя jQuery, выберите следующий блок <select>и измените его значение

0 голосов
/ 23 мая 2011

Исходя из названия, я могу сделать все, кроме выбора правильного поля.

Макет страницы в основном состоит из нескольких ссылок (class = "class") с окном выбора рядом (есть несколько элементов между окном выбора и ссылкой) на каждую ссылку (class = "games"). Я пытаюсь изменить значение ТОЛЬКО в поле выбора, расположенном непосредственно рядом с нажимаемой ссылкой.

* РЕДАКТИРОВАТЬ *

Вот скрипка с лучшим примером HTML, который я использую: http://jsfiddle.net/ynSeZ/9/

--- Я перепробовал все предложенные ответы, и ни один из них не сработал. спасибо за все усилия до сих пор! ---

это то, что у меня есть до сих пор ... когда я удаляю часть closest (), она работает ... но она меняет значение каждого поля выбора, а не только путь, ближайший к ссылке.

спасибо заранее, фил

Ответы [ 4 ]

2 голосов
/ 23 мая 2011

Вот ваш ответ. Используйте siblings вместо closest: 

$('.class').click(function() {

    var objectID = $(this).attr('objectID');

    $($(this).siblings('.games').get(0)).val(objectID).attr('selected', true);

});

Скрипка: http://jsfiddle.net/maniator/ynSeZ/3/

Теперь, когда я думаю об этом, приведенный выше ответ может быть неправильным. Вы должны реализовать что-то, чтобы получить ближайший элемент select. Код выше получает первый элемент выбора на странице, а не тот, который ближе всего к тегу a

UPDATE

Вот ответ, основанный на вашей новейшей скрипке: 

$('.pick_team').click(function() {

    var objectID = $(this).attr('team_id');

    var select_object = $('select', $(this).parent().parent());

    select_object.val(objectID)
});

Скрипка: http://jsfiddle.net/maniator/ynSeZ/12/

1 голос
/ 23 мая 2011

Вы должны изменить свой HTML-код таким образом, чтобы ссылка, по которой щелкали, содержала только один элемент выбора «одноуровневый».Например: 

...
<div class="container">
    <a href="#" class="class" ... >Value 1</a>
    <a href="#" class="class" ... >Value 2</a>
    <select>
        <option>Foo</option>
        ...
    </select>
</div>

Затем сделайте это в своем Javascript, чтобы получить правильный элемент выбора: 

$(this).sibling("select")

, где this - ссылка, по которой щелкнули.

Функция closest вводит в заблуждение.Он находит ближайшего предка элемента, который соответствует данному селектору.

0 голосов
/ 23 мая 2011

Время для хорошей, старомодной while петли: 

$('.class').click(function() {
    $next = $(this).next();

    while ($next.prop('tagName') !== 'SELECT' && $next.size() > 0)
    {
        $next = $next.next();
    }

    if ($next.prop('tagName') === 'SELECT')
    {
        $next.val($(this).attr('objectID'));
    }
});

jsFiddle: http://jsfiddle.net/cM4B5/3/

Редактировать: небольшая опечатка в jsFiddle помешала работе второй ссылки. Обновленный.

0 голосов
/ 23 мая 2011

Может как то так?

ОБНОВЛЕНО Это захватит поле выбора в той же строке и установит значение как team_id по нажатой ссылке 

$('.pick_team').click(function() {
     var val = $(this).attr('team_id'); // grab the team id - we'll use this to determine the selected option in the select box
    //alert(val); // debugging
    $(this).closest('tr').find('select option[value="'+val+'"]').attr("selected","selected");

});
...