如何在jQuery中获取选定的下拉值？答案

【问题标题】：How to get selected dropdown values in jQuery?如何在jQuery中获取选定的下拉值？
【发布时间】：2016-01-20 06:18:42
【问题描述】：

我正在尝试从两个下拉列表中获取选定的值。但我的代码只显示下拉列表的第一个值（<option>）。

即使我选择第二个选项，我仍然得到下拉列表的第一个值。

这里是演示：https://codepen.io/anon/pen/OMOYGe

这是我的 jQuery：

$(document).ready(function() {
    /* saving selected values in variables */
    var selected_destination = $('.text-one :selected').val();
    var selected_attraction_or_activity = $('.text-two :selected').val();

    /* Showing selected values when the button is clicked*/
    $('#attr_acti_btn').click(function(){
        alert (selected_destination);
        alert (selected_attraction_or_activity);
        document.getElementById("myDiv").innerHTML = selected_destination;
 document.getElementById("attr_or_act_div").innerHTML = selected_attraction_or_activity;
    });

});

我做错了什么？如果选择第二个值并点击按钮Click to Show!，我如何获得第二个值？

为什么 ******* 我对这个问题投了反对票？这个问题有什么问题？

【问题讨论】：

把这个var selected_destination = $('.text-one :selected').val(); var selected_attraction_or_activity = $('.text-two :selected').val(); 放在点击事件样本里jsfiddle.net/urpnerpu
谢谢.. 那锅.. 把这个作为答案。我会接受的。
回答它快乐的编码伙伴。

标签： jquery jquery-selectors html-select dropdown

【解决方案1】：

你需要把这些

var selected_destination = $('.text-one :selected').val(); 
var selected_attraction_or_activity = $('.text-two :selected').val();

在点击事件中。因为您需要在单击事件期间获取所选选项的值。而不是在加载元素期间。

$(document).ready(function() {
  /* saving selected values in variables */

  /* Showing selected values when the button is clicked*/
  $('#attr_acti_btn').click(function() {
    var selected_destination = $('.text-one :selected').val();
    var selected_attraction_or_activity = $('.text-two :selected').val();

    alert(selected_destination);
    alert(selected_attraction_or_activity);
    document.getElementById("myDiv").innerHTML = selected_destination;
    document.getElementById("attr_or_act_div").innerHTML = selected_attraction_or_activity;
  });

});

DEMO

【讨论】：

【解决方案2】：

你错过了一个简单的逻辑：

当您更改所选值时，

$('#attr_acti_btn').click(function() {
  var selected_destination = $('.text-one :selected').val();
  var selected_attraction_or_activity = $('.text-two :selected').val();
  alert(selected_destination);
  alert(selected_attraction_or_activity);
  document.getElementById("myDiv").innerHTML = selected_destination;
  document.getElementById("attr_or_act_div").innerHTML = selected_attraction_or_activity;
});

【讨论】：

【解决方案3】：

试试这个：

$(document).ready(function() {
    /* saving selected values in variables */

    /* Showing selected values when the button is clicked*/
    $('#attr_acti_btn').click(function(){
  var selected_destination = $('.text-one :selected').val();
    var selected_attraction_or_activity = $('.text-two :selected').val();

        alert (selected_destination);
        alert (selected_attraction_or_activity);
        document.getElementById("myDiv").innerHTML = selected_destination;
 document.getElementById("attr_or_act_div").innerHTML = selected_attraction_or_activity;
    });

});

DEMO

【讨论】：