値がJQueryの選択リストにあるかどうかを確認します


回答:


180

等しい属性セレクタを使用する

var thevalue = 'foo';
var exists = 0 != $('#select-box option[value='+thevalue+']').length;

オプションの値がJavaScriptを介して設定された場合、それは機能しません。この場合、以下を実行できます。

var exists = false;
$('#select-box option').each(function(){
    if (this.value == 'bar') {
        exists = true;
        return false;
    }
});

8
明示的な2番目のアプローチも]、「\」などの任意の文字を含むオプション値を許可するため、より安全です。適切なCSSエスケープを行わずに、生のテキストからセレクター文字列を構築しないでください。
ボビンス2010

8
なぜreturn false
Grant Birchmeier、2013

14
.eachループを中断または終了するには、falseを返します。
エンジェル

このロジックを使用してJavaScriptで新しいオプションを作成する場合:$( '#select-box')。append($( '<option value = "' + value + '">' + text + '</ option>')) ; (またはもちろん、よりおしゃべりなスタイルで)、最初の例が機能します(反復する必要はありません)。
Lukas Jelinek 2014

1
最初のコードスニペットが機能しないケースを見つけることができないようです。新しいオプションの追加と、jQueryのval()関数を使用した既存のオプションの値の設定の両方を試しました。どちらの場合も、最初のコードスニペットは引き続き機能しました。どのような場合に失敗しますか?
ダリン

17

あなた(または他の誰か)がjQueryなしでそれを行うことに興味があるかもしれない場合に備えて:

var exists = false;
for(var i = 0, opts = document.getElementById('select-box').options; i < opts.length; ++i)
   if( opts[i].value === 'bar' )
   {
      exists = true; 
      break;
   }

なぜi ++だけではないのですか?
csr-nontol

1
++ i接頭辞は常にpostfix @ csr-nontolより速い
Alok

11

ここに別の同様のオプションがあります。私の場合、選択リストを作成するときに別のボックスの値をチェックしています。比較するときに未定義の値に遭遇し続けたので、次のようにチェックを設定しました。

if ( $("#select-box option[value='" + thevalue + "']").val() === undefined) { //do stuff }

このアプローチの方が高額かどうかはわかりません。


8

フィルターを使用しないのはなぜですか?

var thevalue = 'foo';    
var exists = $('#select-box option').filter(function(){ return $(this).val() == thevalue; }).length;

存在する> 0はtrue、存在する== 0はfalseであるため、緩やかな比較が機能します。

if(exists){
    // it is in the dropdown
}

またはそれを組み合わせる:

if($('#select-box option').filter(function(){ return $(this).val() == thevalue; }).length){
    // found
}

または、各選択ドロップダウンにselect-boxesクラスがある場合、これにより、値を含む選択のjqueryオブジェクトが得られます。

var matched = $('.select-boxes option').filter(function(){ return $(this).val() == thevalue; }).parent();

これは最も直感的な方法です。
Simon

4

if(!$('#select-box').find("option:contains('" + thevalue  + "')").length){
//do stuff
}


あなたのソリューションでは、それはないですtheValueが、option_number中にドロップダウン。あなたの解決策は間違っています。
アルスマンアフマド

1

私はこれが古い質問の一種であることを知っています。

if(!$('.dropdownName[data-dropdown="' + data["item"][i]["name"] + '"] option[value="'+data['item'][i]['id']+'"]')[0]){
  //Doesn't exist, so it isn't a repeat value being added. Go ahead and append.
  $('.dropdownName[data-dropdown="' + data["item"][i]["name"] + '"]').append(option);
}

この例でわかるように、一意のタグのデータドロップダウン名と選択したオプションの値で検索しています。もちろん、これらが機能するためにこれらは必要ありませんが、他の人が複数の値を検索できることなどを他の人に見られるように含めました。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.