jQuery 获取选定的选项值(不是文本,而是属性 'value')

新手上路,请多包涵

好的,我有这个代码:

 <select name="selector" id="selector">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</select>

我想获得所选选项的值。示例:选择“选项 2”,其值为“2”。 “2”是我需要获得的值,而不是“选项 2”。

原文由 n00b 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 298
2 个回答

04/2020:更正旧答案

在所选选项上使用 :selected 伪选择器,然后使用 .val 函数获取选项的值。

 $('select[name=selector] option').filter(':selected').val()

旁注:使用过滤器比直接在第一个查询中使用 :selected 选择器更好。

如果在更改处理程序中,您可以简单地使用 this.value 来获取选定的选项值。有关更多选项,请参见演示。

 //ways to retrieve selected option and text outside handler
console.log('Selected option value ' + $('select option').filter(':selected').val());
console.log('Selected option value ' + $('select option').filter(':selected').text());

$('select').on('change', function () {
  //ways to retrieve selected option and text outside handler
  console.log('Changed option value ' + this.value);
  console.log('Changed option text ' + $(this).find('option').filter(':selected').text());
});
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<select>
  <option value="1" selected>1 - Text</option>
  <option value="2">2 - Text</option>
  <option value="3">3 - Text</option>
  <option value="4">4 - Text</option>
</select>

旧答案:

编辑: 正如许多人指出的那样,这不会返回所选的选项值。

~~使用 .val 获取选中选项的值。见下文,

 $('select[name=selector]').val()~~

原文由 Selvakumar Arumugam 发布,翻译遵循 CC BY-SA 4.0 许可协议

我只是想分享我的经验

为了我,

$('#selectorId').val()

返回空值。

我不得不使用

$('#selectorId option:selected').val()

原文由 David Torres 发布,翻译遵循 CC BY-SA 4.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题