jQuery <option>要素を取得しようとすると、未定義のエラー

Question

<select>タグと<option>タグを持つhtmlがあります。私は、このように特定のオプション/値を取得：

$(targetElement).children("option[text=" + Text + "]").val(); 

targetElementは私<select>要素であり、Textは私が検索したいオプションのテキストです。

select（on jsFiddle）内に複数の選択肢があるとき、これは正常に動作しますが、唯一の1つのオプションがある場合、私は（on jsFiddle）undefinedを入手！

オプションが1つしかないときに、なぜ動作しないのか、誰に教えてもらえますか？

Answer 1

はこれを試してみてください：

$(function(){ 
    var lastOptionValue = $('select > option:last').val(); 
    alert(lastOptionValue); 
}); 

あなたはhereを試すことができます。

EDIT： 申し訳ありませんが、私はunattentiveだった...

これはあなたのcorrect exampleです：

$(function(){ 
    text = 'Foo'; 
    var $last = $('select>option').filter(function(){ 
    return $(this).text() == text; 
    }).last(); 
    if ($last.length > 0){ 
    alert($last.val()); 
    } 
}); 

あなたはfilter()匿名関数でより多くの機能を追加することができます。たとえば、RegExpなど必要なものがあります。

Answer 2

[name=value]構文は、要素の属性をチェックするためのものです。たとえば、FooInAttributeは一致させますが、FooInContentsは一致させません。両方のシナリオで

<option value="42" text="FooInAttribute">FooInContents</option> 

<option>タグ利用可能な複数存在するとき、それは動作しますなぜ私はあなたを伝えることはできませんが、:contains作品。代わりにこれを試してみてくださいが、InviSノートでは、これはリストのどのオプションも他のもののフルテキストを含んでいないと仮定しています（つまり、 'Burger'というオプションがある場合、別の 'Burger and Fries'を持ってはいけません）：

それはテキストだと

var txt = "Bar"; 
var x = $('select').children().filter(function() { 
    return $(this).text() == txt; 
}).val(); 
console.log(x); 

これは「バー」で一つの値を返します。

$(targetElement).children("option:contains('" + text + "')").val(); 

Answer 3

また.filter()方法を利用することができます。