【jQuery】セレクト要素内オプションのテキストを取得する方法。

選択されたオプションの値ではなく、表示されている文字列(テキスト)を取得する方法。

例えば以下のようなセレクト要素があると仮定する。

<select class="select">
<option value="1">hoge</option>
<option value="2">piyo</option>
<option value="3">fuga</option>
</select>

この時、「1, 2, 3」という値ではなく、「hoge, piyo, fuga」といったテキストが欲しい場合、下記のようなセレクタで取得することが出来る。

<script>
$(function(){
	// セレクトボックスの値が変更された際に実行
	$('.select').change(function(){
		var text = $(this).children('option:selected').text();
		console.log(text);
	})
})
</script>

「:selected」を指定してやるところがポイント。