如何在 jQuery 中获取选定的选项元素属性？

Question

我想获取所选选项元素的属性值。

jQuery：

$("#select_element").val().attr("val");

HTML：

 <select id="select_element" class="selectpanel">
     <option val="x">element1</option>
     <option val="y">element2</option>
 </select>

Answer 1

试试这个：

$('#select_element option:selected').attr('val');

或者

$('#select_element option:selected').val();

两者都有效！

Answer 2

简单使用：

$("#select_element").val();

如果你想要它的文本，那么：

$('#select_element option:selected').text();

JSFIDDLE

Answer 3

试试这个以获得选项中的值

$("#select_element").val()

试试这个来选择 te 选项中的文本

$('#slcFoo option:selected').text()

可以看例子here

Answer 4

重新显示您的编辑：

<option val="x">element1</option>

val 不是option 元素的有效属性。正确的属性是value，或者如果您想要自定义属性，请使用data- 前缀（例如data-val）。

所以取决于你的意思是value 还是data-val：

如果你的意思是value:

$("#select_element").val() 是否在选择框中为您提供所选option 元素的值（value 属性）：

console.log($("#select_element").val());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="select_element">
  <option value="1">One</option>
  <option value="2" selected>Two</option>
  <option value="3">Three</option>
</select>

如果你的意思是data-val:

如果你想从同一个 option 元素中获取一些 other 属性，你可以这样做：

var otherAttributeValue = $("#select_element option:selected").attr("data-val");

例如：

var otherAttributeValue = $("#select_element option:selected").attr("data-val");
console.log(otherAttributeValue);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="select_element">
  <option data-val="first" value="1">One</option>
  <option data-val="second" value="2" selected>Two</option>
  <option data-val="third" value="3">Three</option>
</select>