jQuery를 사용하여 드롭다운 옵션을 선택하는 방법은 무엇입니까?

jQuery를 사용하여 드롭다운 옵션을 선택하는 방법은 무엇입니까?

저는 jQuery가 선택할 수 있는지 궁금합니다.<option>네 번째 항목을 드롭다운 상자에 넣을까요?

<select>
    <option></option>
    <option></option>
    <option></option>
    <option></option>
    <option></option>
</select>

나는 사용자가 링크를 클릭하고, 그리고 나서.<select>사용자가 선택한 것처럼 상자 값을 변경합니다.<option>.

어때.

$('select>option:eq(3)').attr('selected', true);

예:

$('select>option:eq(3)').attr('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>

---

현대 버전의 jquery를 위해 당신은 대신에 를 사용해야 합니다..attr()

$('select>option:eq(3)').prop('selected', true);

예:

$('select>option:eq(3)').prop('selected', true);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>

해결책:

$("#element-id").val('the value of the option');

HTML 선택 요소에는 특정 옵션을 선택하기 위해 쓸 수 있는 속성이 있습니다.

$('select').prop('selectedIndex', 3); // select 4th option

일반 JavaScript를 사용하면 다음과 같은 작업을 수행할 수 있습니다.

// use first select element
var el = document.getElementsByTagName('select')[0]; 
// assuming el is not null, select 4th option
el.selectedIndex = 3;

이런 식으로 하겠습니다.

 $("#idElement").val('optionValue').trigger('change');

가장 쉬운 방법은.val(value)함수:

$('select').val(2);

선택한 값을 가져오려면 인수를 지정하지 않습니다.

$('select').val();

또한, 만약 당신이 가지고 있다면.<option value="valueToSelect">...</option>할 수 있는 일:

$('select').val("valueToSelect");

데모

옵션에 값이 있는 경우 다음을 수행할 수 있습니다.

$('select').val("the-value-of-the-option-you-want-to-select");

'select'는 선택자 또는 클래스 선택자의 ID입니다.또는 선택 항목이 하나만 있는 경우 예제와 같이 태그를 사용할 수 있습니다.

특정 값을 가진 옵션을 선택하려면 다음 코드를 사용합니다.

$('select>option[value="' + value + '"]').prop('selected', true);

 Try with the below codes. All should work. 
    $('select').val(2);
    $('select').prop('selectedIndex', 1);
    $('select>option[value="5"]').prop('selected', true);
    $('select>option:eq(3)').attr('selected', 'selected');
    $("select option:contains(COMMERCIAL)").attr('selected', true);

저는 eq()보다 n번째 자녀()를 선호하는데, 이는 제 뇌에서 조금 더 쉬운 0 기반 인덱싱이 아닌 1 기반 인덱싱을 사용하기 때문입니다.

//selects the 2nd option
$('select>option:nth-child(2)').attr('selected', true);

 $('select>option:eq(3)').attr('selected', 'selected');

여기서 한 가지 주의할 점은 선택/옵션의 변경 이벤트를 감시하는 Javascript가 있는 경우 추가해야 한다는 것입니다..trigger('change')그래서 코드는.

 $('select>option:eq(3)').attr('selected', 'selected').trigger('change');

왜냐하면 전화만 하기 때문입니다..attr('selected', 'selected')이벤트를 트리거하지 않습니다.

'' 요소에서는 일반적으로 'value' 특성을 사용합니다.그러면 설정이 더 쉬워집니다.

$('select').val('option-value');

사용해 보십시오.

$('#mySelectElement option')[0].selected = true;

잘 부탁드립니다!

ID로 답변:

$('#selectBoxId').find('option:eq(0)').attr('selected', true);

이것은 나에게 도움이 됩니다.

$selectedindex=4

옵션을 임의로 지정하려는 경우 항상 다음과 같은 작업을 수행할 수 있습니다.

$0selectedindex=Math.floor((Math.random()*($0.length-1)+1)

두 번째 질문은 질문의 범위 밖에 있지만, 첫 번째 질문이 어떻게 적용/수정될 수 있는지 설명하는 역할을 합니다.

언급URL : https://stackoverflow.com/questions/4864620/how-to-use-jquery-to-select-a-dropdown-option