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

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

0 голосов
/ 04 января 2012

У меня есть два выпадающих списка - для месяца и года - и кнопка.Когда пользователь нажимает кнопку, я хочу получить выбранное значение месяца и значение года и передать их в виде строки запроса на URL-адрес, подобный следующему: https://mysite.com/events.aspx?my=may2012.

Как получить эти значения с помощью jQuery или Javascript? 

<div id="datepicker"></div>
<div class="calendForm">
    <span class="inpMonth">
        <select>
            <option selected="selected">September</option>
        <option>August</option>
        <option>July</option>
        <option>June</option>
        <option>May</option>
        <option>April</option>
        <option>March</option>
        <option>February</option>
        <option>January</option>
        <option>December</option>
        <option>November</option>
        <option>October</option>
        </select>
    </span>
    <span class="inpYear">
        <select>
            <option selected="selected">2012</option>
            <option>2013</option>
            <option>2014</option>
        <option>2015</option>
        </select>
    </span>
    <a href="#" type="submit" class="btnBlue"><span>GO</span></a>
</div><br />

Ответы [ 4 ]

1 голос
/ 04 января 2012

В ответе Т. Стоуна есть ошибка. селектор должен иметь точку. Кроме этого - отличный ответ!

Смотрите мою скрипку 

<script>
$(function(){$(".btnBlue").click(function(){
    window.location = "https://mysite.com/events.aspx?my=" + $(".inpMonth select").val().toLowerCase() + $(".inpYear select").val();
})})
</script>
1 голос
/ 04 января 2012

Я предполагаю, что вы хотите, чтобы все это происходило при событии нажатия btnBlue.

Начните с обработчика нажатия ... 

$('a.btnBlue').click(function() {
   // ...
});

Затем получите значениямесяц / год ... 

var month = $('.inpMonth select').val();
var year = $('.inpYear select').val();

Затем перейдите по этому URL ... 

window.location.href = 'https://mysite.com/events.aspx?my=' + month + year;

Все вместе это ... 

$('a.btnBlue').click(function() {
    var month = $('.inpMonth select').val();
    var year = $('.inpYear select').val();
    window.location.href = 'https://mysite.com/events.aspx?my=' + month + year;
});
0 голосов
/ 04 января 2012

Чтобы получить месяц, попробуйте 

$(".inpMonth select").val();

Для анализа всей формы, попробуйте .serialize () и .serializeArray () попробовать 

$("form").serialize()
0 голосов
/ 04 января 2012

сначала получите ссылки на ваши объекты SELECT и LINK: 

var button = $('a.btnBlue');
var month = $('#datepicker .inpMonth select');
var year = $('#datepicker .inpYear select');

затем создайте функцию для возврата текущего месяца и года в виде строки: 

function currentSelection() {
  return month.val() + year.val();
}

createфункция, которая перемещает вас к новому URL-адресу на основе currentSelection (): 

function navigateToDate() {
  window.location.href = "https://mysite.com/events.aspx?my=" + currentSelection();
}

при нажатии кнопки, вызовите navigateToDate (): 

button.click( navigateToDate );
...