在 jquery 中的下拉更改事件上未定义下拉选择的值答案

【问题标题】：Drop down selected value is undefined on drop down change event in jquery在 jquery 中的下拉更改事件上未定义下拉选择的值
【发布时间】：2015-08-28 01:58:12
【问题描述】：

我在 MVC 应用程序中使用下拉菜单 Drop down 有两个值。我得到了 html 中的值和文本（来自 firebug）。但我面临一个奇怪的问题。我在下拉更改事件中获取下拉选定值未定义和选定文本一个空字符串。

我的代码是这样的：

$('#mydropdownid').on("change",function(){

    var selectedValue=$('#mydropdownid option:selected').val();
    var selectedText=$('#mydropdownid option:selected').text();

});

我也试过 $('#mydropdownid').find('option:selected').text();

但结果是一样的。应该是什么问题？？

【问题讨论】：

您的代码在这一行中有错误var selectedValue=$('#mydropdownid option:selected).val(); 有选择器的结束引号。这可能是一个错字。如果不是，则更新您的代码。
您是否更改了下拉内容，而不是正常单击它？或通过一些 javascript 或数据绑定？
只是从 UI @owen 正常点击它

标签： jquery html

【解决方案1】：

您可以使用$(this) 并获取.val() 和.text()，如下所示：

$('#mydropdownid').on("change", function() {
  var value = $(this).val();
  var text = $(this).find('option:selected').text();
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="mydropdownid">
  <option value="1">1</option>
  <option value="2">2</option>
</select>

通过使用$(this)，您可以更改 id，而无需遍历所有代码并在任何地方更新 id。

【讨论】：

【解决方案2】：

在下拉菜单中直接使用.val()，如下所示：

$('#mydropdownid').on("change",function(){

    var selectedValue=$('#mydropdownid').val();
    var selectedText=$('#mydropdownid option:selected').text();

});

.text() 应该可以正常工作。 See here.

【讨论】：