jQuery의 SELECT 요소에서 특정 옵션을 선택하는 방법

질문 : jQuery의 SELECT 요소에서 특정 옵션을 어떻게 선택합니까?

---

색인, 값 또는 텍스트를 알고있는 경우. 직접 참조 할 수있는 ID가없는 경우에도 마찬가지입니다.

이것 , 이것 그리고 이것은 모두 유용한 답변입니다.

마크 업 예

<div class="selDiv">
  <select class="opts">
    <option selected value="DEFAULT">Default</option>
    <option value="SEL1">Selection 1</option>
    <option value="SEL2">Selection 2</option>
  </select>
</div>

답변

---

중간 옵션 요소를 값으로 가져 오는 선택기는 다음과 같습니다.

$('.selDiv option[value="SEL1"]')

색인의 경우 :

$('.selDiv option:eq(1)')

알려진 텍스트의 경우 :

$('.selDiv option:contains("Selection 1")')

편집 : 위에 언급했듯이 OP는 드롭 다운의 선택한 항목을 변경 한 후 일 수 있습니다. 버전 1.6 이상에서는 prop () 메서드가 권장됩니다.

$('.selDiv option:eq(1)').prop('selected', true)

이전 버전 :

$('.selDiv option:eq(1)').attr('selected', 'selected')

EDIT2 : Ryan의 의견 후. "선택 10"에 대한 일치는 원하지 않을 수 있습니다. 전체 텍스트와 일치하는 선택기 를 찾지 못했지만 필터가 작동합니다.

 $('.selDiv option')
    .filter(function(i, e) { return $(e).text() == "Selection 1"})

EDIT3 $(e).text() 와 함께주의를 사용하십시오. 비교를 실패하게 만드는 줄 바꿈을 포함 할 수 있습니다. 옵션이 암시 적으로 닫혀있을 때 발생합니다 ( </option> 태그 없음).

<select ...>
<option value="1">Selection 1
<option value="2">Selection 2
   :
</select>

e.text 를 사용하면 후행 줄 바꿈과 같은 추가 공백이 제거되어 비교가 더욱 강력 해집니다.

출처 : https://stackoverflow.com/questions/314636/how-do-you-select-a-particular-option-in-a-select-element-in-jquery