获取选定的下拉选项值 jquery答案

【问题标题】：get seleceted dropdown option value jquery获取选定的下拉选项值 jquery
【发布时间】：2012-01-04 05:45:05
【问题描述】：

我有两个下拉菜单（月份和年份）和一个按钮。当用户单击按钮时，我想获取选定的月份值和年份值并将它们作为查询字符串传递给这样的 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 />

【问题讨论】：

标签： javascript jquery onclick drop-down-menu selected

【解决方案1】：

T. Stone 的回答有误。选择器应该有一个点。除此之外 - 很好的答案！

See my fiddle

<script>
$(function(){$(".btnBlue").click(function(){
    window.location = "https://mysite.com/events.aspx?my=" + $(".inpMonth select").val().toLowerCase() + $(".inpYear select").val();
})})
</script>

【讨论】：

【解决方案2】：

我假设您希望这一切都发生在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;
});

【讨论】：

【解决方案3】：

首先，获取对您的 SELECT 和 LINK dom 对象的引用：

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

接下来，创建一个函数以字符串形式返回当前月份和年份：

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

创建一个基于 currentSelection() 导航到新 url 的函数：

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

当按钮被点击时，调用 navigateToDate():

button.click( navigateToDate );

【讨论】：

【解决方案4】：

获取月份试试

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

要解析整个表单，试试 .serialize() 和 .serializeArray()

$("form").serialize()

【讨论】：