时间戳

首页 > 解决方案 > 获取没有选定属性的选定选项

javascript - 获取没有选定属性的选定选项

问题描述

所以如果这是我的示例代码：

<select id="box1" name="selectArea">
<option value="98">dog</option>
<option value="7122">cat</option>
<option value="142">bird</option>
</select>

这是我的 jQuery 代码：

var x = document.getElementsByName("selectArea")[0];
var selected = x.options[x.selectedIndex].value;

this 的值总是错误的，因为选项中没有“selected”属性。就我而言，我使用的是新表单，用户可以选择一个值。当他们选择一个选项时，“selected”属性不会自动附加到该选项。

我将如何选择没有实际选定属性的选项？这甚至可能吗？当我在下拉列表中选择另一个选项时， x.selectedIndex 的值不会改变。

标签： javascriptjquery

解决方案

在 jQuery 中，您可以简单地使用$("[name='selectArea']").val()

var option = $("[name='selectArea']").val();

console.log(option);

$("[name='selectArea']").on('change', function(){
  var option = $("[name='selectArea']").val();
  console.log(option);
});

$('button').on('click', function(){
  alert($("[name='selectArea'] option:selected").text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="box1" name="selectArea">
<option value="98">dog</option>
<option value="7122">cat</option>
<option value="142">bird</option>
</select>
<button>Click Me</button>

推荐阅读