如何在jQuery中选择选项元素attr？

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").val();

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

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

<强> JSFIDDLE

Answer 2

试试这个：

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

或

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

两者都有效！

Answer 3

重新编辑显示：

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

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

因此，取决于您的意思是value还是data-val：

如果您的意思是value：

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

＆＃13;

＆＃13;

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

＆＃13;

<!-- Temporary snippet object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<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>

＆＃13;

＆＃13;

＆＃13;

如果您的意思是data-val：

如果您想从同一个option元素中获取某些其他属性，请执行以下操作：

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

E.g：

＆＃13;

＆＃13;

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

＆＃13;

<!-- Temporary snippet object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<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>

＆＃13;

＆＃13;

＆＃13;

Answer 4

尝试此操作以获取选项中的值

$("#select_element").val()

并尝试使用此选项来获取选项中的文字

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

您可以看到示例here