jquery изменить attr href со значением из select

Question

У меня есть эта форма:

<div id="select_1">
<select class="select-class">
    <option value="value_1" selected="selected">1</option>
    <option value="value_2">2</option>
    <option value="value_3">3</option>
</select>
<a href="#" class="a-class">Link</a> 
</div> 

<div id="select_2">
<select class="select-class">
    <option value="value_1">1</option>
    <option value="value_2" selected="selected">2</option>
    <option value="value_3">3</option>
</select>
<a href="#" class="a-class">Link</a> 
</div>

<div id="select_3">
<select class="select-class">
    <option value="value_1" selected="selected">1</option>
    <option value="value_2">2</option>
    <option value="value_3">3</option>
</select>
<a href="#" class="a-class">Link</a> 
</div>

Для каждой строки выбранного элемента я хочу изменить attr href следующим значением: href = "url.com?" + Значение параметра, выбранного из select

Как я могу сделать это с помощью jquery?

Thx

Answer 1

Правильно ли я вас понимаю, если предположу, что когда пользователь выбирает опцию из одного из элементов select , смежный элемент a должен быть обновлен? В этом случае:

// jquery 1.7
$(function() {
    $("select.select-class").on("change", function() {
        var link = $(this).parent().find("a.a-class");
        link.attr("href", "url.com?" + $(this).val());
    });
}

Также может потребоваться обновить все элементы a , когда документ загружен в браузер. В этом случае:

$(function() {
    $("select.select-class").each(function() {
        var link = $(this).parent().find("a.a-class");
        link.attr("href", "url.com?" + $(this).val());
    });
});

Answer 2

Вы можете просто изменить href attr тега после изменения значения выбора.Вы можете попробовать рабочий код здесь , он устанавливает атрибут href ссылки каждый раз, когда изменяется значение поля выбора.

$('select.select-class').change(function(){
    alert($(this).val());
    var url = "url.com?";
    url += $(this).val();
    $(this).next().attr('href', url);
});