2016-08-03 7 views
0

私はJQuery 1.8を使用しています。私はしかし、この文jqueryを使用して値に一致する最初のオプションのみを選択するにはどうすればよいですか?

$('.countryField').find('option[value="233"]') 

を使用して値によって、私の選択メニューでオプションを選択したい、同じ値を持つ複数のオプションがある場合、上記の問題は、すべてが選択されています。 1つのオプションだけが選択されるように上記のステートメントを調整するにはどうすればよいですか?私にメッセージを送って、同じ値を持つ複数のオプションを持つメニューを選択するべきではないことについて、自由に教えてください。

編集:ここではは、あなたが最初にマッチしたDOM要素を選択し、ここで:firstセレクタを使用することができます

> $('.countryField').find('option').prop('selected', false) 
jQuery.fn.init[255] 
> $('.countryField').find('option[value="233"]:first').prop('selected', true) 
[<option value=​"233" selected=​"selected">​United States​</option>​] 
> $('.countryField').find('option[selected="selected"]') 
[<option value=​"233" selected=​"selected">​United States​</option>​, <option selected=​"selected" value=​"233">​United States​</option>​] 
+0

でもを行うことができます - あなたはその後、 '選択して要素を選択、**' selected' **プロパティを設定しています**属性**。オブジェクトのプロパティの値を更新しても、html要素の属性は変更されません。プロパティを設定する答えは正しいが、正しく選択していない - https://jsfiddle.net/h9neus61/ –

答えて

0

与えられた候補の1つに応答して、コンソール出力です。

$('.countryField').find('option[value="233"]:first') 
+0

これは動作しません。私は私の編集でコンソールのouptutを含めた。あなたの提案を適用した後、まだ2つのオプションが選択されています。 –

+0

ページに複数の 'countryField'選択要素がありますか? –

+0

'$( '。countryField')。length'のように、ページ上にいくつの' countryField'選択要素があるかを一度チェックしてください。 find( 'option [value = "233"]:first')のように1つの選択リストで選択することができます: '(countryField:first' ) '長さ ' –

0

:eq(0)は値 "233"を持つ最初のオプションを選択するために使用され、選択されます。

$('.countryField [value="233"]:eq(0)').prop('selected', true); 
+0

palashの提案と同様に、これも機能しません。私の質問の編集は出力をリストアップします。あなたが "$( '。countryField')。find( 'option [value =" 233 "]:first')"をあなたの提案と置き換えた場合、出力は依然として2つの選択肢です。 –

0

これはあなたの編集に対応して、純粋なJavascriptを

document.querySelector(' .countryField option').setAttribute('selected','selected') 
+0

これはリストの最初のオプションを出力します。何も選択したり選択を解除したりしません。 –

関連する問題