選択されたオプションの値ではなく、表示されている文字列(テキスト)を取得する方法。
例えば以下のようなセレクト要素があると仮定する。
<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」を指定してやるところがポイント。