web-dev-qa-db-ja.com

jQueryでselectの選択されたオプションから属性を取得するにはどうすればよいですか？

HTMLに次のselectboxがあります：

<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実際に別のオプションを選択していたにもかかわらず。

何が問題なのですか、問題を解決するにはどうすればよいですか？

javascriptjqueryselectweboption
8
user2402179

：selected セレクターを使用

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

ただし、_data-_プレフィックス属性を使用することをお勧めします。次に、.data()を使用できます

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

[〜＃〜] demo [〜＃〜]

33
Satpal