web-dev-qa-db-ja.com

JS / Jquery：ドロップダウンで値が選択されているかどうかを確認する方法は？

私はグーグルでこれを行うためのいくつかの方法を試しましたが、今のところうまくいきません。私が探しているのは非常に単純です。ドロップダウンに選択された値があるかどうかを確認できるようにしたいのです。問題は、selectedIndex、：selected、val（）などが次の場合に結果を返すことです。

<select>
<option value="123">123</option>
<option value="234">234</option>
</select>

明らかに、ブラウザは123オプションが選択された状態でこのドロップダウンを表示しますが、他のオプションがないためにのみ選択されます。実際には、「選択された」プロパティがないため、このドロップダウンには選択された値がありません。だから基本的に私は上記のドロップダウンをこれと区別する方法を見つけようとしています

<select>
<option selected value="123">123</option>
<option value="234">234</option>
</select>
javascriptjquerydrop-down-menu
16
Eugene
var hasValue = ($('select > [selected]').length > 0);

または、

var hasValue = $('select').has('[selected]');
19
John Strickler

迅速な解決策：

_<select>
<option selected></option>
<option value="123">123</option>
<option value="234">234</option>
</select>
_

次に、.val()があるかどうかを確認します

2
Jason

承認された答えは私にはうまくいかないようです。

すべての選択オプションが選択されているかどうかを確認する方法は次のとおりです。

if($('select option:selected').length > 0) {
/* Do your stuff here */
}
1
JasonP

私の知る限り、2つの例の間に機能的な違いはありません。基本的に、ブラウザは最初のoptionを自動的に選択します。

たとえば、の結果を参照してください

_$('option:selected')
_

あなたの最初の例で。

これを本当に防ぎたい場合は、2つのオプションがあります。 1つ目は、ジェイソンの回答に従って、新しい空の要素をselectに導入することです。もう1つのオプションは、自動的に選択された値の選択を解除することです。

_$(document).load(function(){
    $('option:selected').attr('selected', false);
});
_

これにより、選択がクリアされます。したがって、空の文字列ではない$('select').val()の結果は、ユーザーによって変更されます。

0
lonesomeday