[jquery] jQuery를 사용하여 드롭 다운의 선택된 인덱스 설정

Program / 글쓴이

컨트롤을 찾는 방법이 다음과 같은 경우 jQuery에서 드롭 다운 인덱스를 설정하는 방법은 무엇입니까?

$("*[id$='" + originalId + "']")

컨트롤을 동적으로 만들고 Web Forms를 사용할 때 ID가 변경 되었으므로이 방법 으로이 작업을 수행하여 일부 컨트롤을 찾을 수 있습니다. 그러나 jQuery 객체가 있으면 선택한 인덱스를 0으로 설정하는 방법을 모릅니다.

답변

우선-그 선택기는 꽤 느립니다. ID를 찾는 모든 DOM 요소를 스캔합니다. 요소에 클래스를 할당 할 수 있으면 성능 저하가 적습니다.

$(".myselect")

질문에 대답하기 위해 jQuery에서 선택 요소 값을 변경하는 몇 가지 방법이 있습니다.

// sets selected index of a select box to the option with the value "0"
$("select#elem").val('0'); 

// sets selected index of a select box to the option with the value ""
$("select#elem").val(''); 

// sets selected index to first item using the DOM
$("select#elem")[0].selectedIndex = 0;

// sets selected index to first item using jQuery (can work on multiple elements)
$("select#elem").prop('selectedIndex', 0);

답변

방금 이것을 발견하면 저에게 효과적이며 개인적으로 읽기가 더 쉽습니다.

이것은 gnarf의 답변 번호 3 옵션과 같이 실제 색인을 설정합니다.

// sets selected index of a select box the actual index of 0 
$("select#elem").attr('selectedIndex', 0);

이것은 작동하지 않았지만 지금은 … 버그를 참조하십시오 :
http://dev.jquery.com/ticket/1474

추가

의견에서 권장하는대로 다음을 사용하십시오.

$("select#elem").prop('selectedIndex', 0);

답변

2015 년 에이 답변을 작성 중이며 어떤 이유로 (아마도 이전 버전의 jQuery) 다른 답변은 저에게 도움이되지 않았습니다. 그들은 선택한 인덱스를 변경하지만 실제로 실제 드롭 다운을 반영하지는 않습니다.

색인을 변경하고 드롭 다운에 반영하는 다른 방법은 다음과 같습니다.

$('#mydropdown').val('first').change();

답변

나는 사용하고있다 

$('#elem').val('xyz');

value = ‘xyz’인 옵션 요소를 선택하려면

답변

JQuery 코드 :

$("#sel_status").prop('selectedIndex',1);

JSP 코드 :

Status:
<select name="sel_status"
    id="sel_status">
    <option value="1">-Status-</option>
    <option>ALL</option>
    <option>SENT</option>
    <option>RECEIVED</option>
    <option>DEACTIVE</option>
</select>

답변

select 요소에서 첫 번째 옵션의 값을 가져옵니다.

$("*[id$='" + originalId + "']").val($("*[id$='" + originalId + "'] option:first").attr('value'));

답변

두 번째 옵션을 선택하려면

$('#your-select-box-id :nth-child(2)').prop('selected', true);

여기서 우리는 이벤트를 발생시키기 위해`trigger ( ‘change’)를 추가합니다.

$('#your-select-box-id :nth-child(2)').prop('selected', true).trigger('change');