javascript - 如何从 jQuery 中的 select 的选定选项中获取属性？

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');

DEMO