получить предыдущий выбранный выпадающий элемент

Question

У меня есть следующий код, где у меня есть выпадающий список (с class = " addToList " и сопровождаемый кнопкой (Class = " addtoButton "):

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

$(".addToPortalButton").live('click', function (e) {

// grab the previous dropdown list value and text here.

});

, что является самым простым способом сделать это с помощью jquery.

Вот HTML:

<select class="addToList" id="Teams" name="Teams">
     <option></option>
    <option value="49">Team 1</option>
    <option value="22">Team 2</option>
</select>
<input type='button' class="addToButton" value='Add to' />

<select class="addToList" id="Teams" name="Teams">
     <option></option>
    <option value="49">Team 1</option>
    <option value="22">Team 2</option>
</select>
<input type='button' class="addToButton" value='Add to' />

<select class="addToList" id="Teams" name="Teams">
     <option></option>
    <option value="49">Team 1</option>
    <option value="22">Team 2</option>
</select>
<input type='button' class="addToButton" value='Add to' />

Answer 1

Вы можете использовать .prev() или .prevAll(), чтобы получить <select>, как показано ниже:

Редактировать: дляболее новые версии jQuery, где .live() устарела, новый синтаксис .on():

$(document).on('click', '.addToButton', function (e) {
  var sel = $(this).prevAll('.addToList:first'),
      val = sel.val(),
      text = sel.find(':selected').text();    
});

Старая версия:

$(".addToButton").live('click', function (e) {
  var sel = $(this).prevAll(".addToList:first"),
      val = sel.val(),
      text = sel.find(':selected').text();    
});

Answer 2

Это можно сделать с помощью следующего кода:

$(".addToButton").on('click', function (e) {

    var $el = $(this).prev().find('option:selected');

});

Затем вы можете использовать $el.val() и $el.text(), чтобы получить значение и текст соответственно.