jQueryで、リストのvalueやlabelを取得する方法

javascript

selectタグで書かれたリストで、選択項目の取得について。
valueと、label（表示するテキスト/項目ラベル）で違うものを設定したとき、label側はどうやって取ればいいかメモ。

optionタグのvalueと、labelが同じ場合

<select id="targetList">
    <option>apple</option>
    <option>orange</option>
    <option>lemon</option>
</select>

このHTMLの場合は、

 jQuery( "#targetList" ).val();

で取得できます。とりあえずドキュメント通り。

optionタグのvalueと、labelが違う場合

<select id="targetList">
    <option value="apple">りんご</option>
    <option value="orange">みかん</option>
    <option value="lemon">れもん</option>
</select>

このHTMLの場合が、チョットめんどくさい。

valueが欲しい。
 jQuery( "#targetList" ).val();

これも、ドキュメント通り。

labelが欲しい。
 jQuery( "#targetList :selected" ).text();

これ、忘れそう。

参考