如何从 jQuery 中选择的选定选项中获取属性？

Question

我在 HTML 中有下一个选择框：

<select id="listbox-taskStatus" class="selectpicker">
    <option status="0">In progress</option>
    <option status="1">Not started</option>
    <option status="2">Done</option>
    <option status="3">Failed</option>
</select>

我想从选定的选项中读取属性值。

如果只是取值，很简单：

var value = $('#listbox-taskStatus').val();

但是，如果我想从选定的选项中获取属性值，我该怎么办？ 我知道， .attr()必须有帮助，但是当我尝试使用它时，我得到了不正确的结果。

我试过下一个：

var status = $('#listbox-taskStatus option').attr('status');

但返回值始终为0 ，尽管事实上我选择了不同的选项。

怎么了，怎么解决我的问题？

Answer 1

使用:selected选择器

var status = $('#listbox-taskStatus option:selected').attr('status');

但是，我建议您使用以data-为前缀的属性。 然后你可以使用.data()

var status = $('#listbox-taskStatus option:selected').data('status');

演示

Answer 2

var optionAttr1 = $('#listbox-taskStatus').find('option:selected').attr("status");
var optionAttr = $('#listbox-taskStatus option:selected').attr("status");