jQuery로 드롭 다운 목록의 선택 값을 변경

해결법

1.jQuery의 문서 상태 :

jQuery의 문서 상태 :

이 문제는 jQuery를 버전 1.2 이상이다.

당신이 가장 가능성이 원하는 :
```
$("._statusDDL").val('2');
```
2.숨겨진 필드를 사용하면이 같은 사용해야합니다 :

숨겨진 필드를 사용하면이 같은 사용해야합니다 :
```
$("._statusDDL").val(2);
$("._statusDDL").change();
```
또는
```
$("._statusDDL").val(2).change();
```
3.그냥 참고로, 당신은이 작업을 수행 할 CSS 클래스를 사용할 필요가 없습니다.

그냥 참고로, 당신은이 작업을 수행 할 CSS 클래스를 사용할 필요가 없습니다.

당신은 클라이언트에 올바른 컨트롤 이름을 얻기 위해 다음 코드 줄을 작성할 수 있습니다 :
```
$("#<%= statusDDL.ClientID %>").val("2");
```
ASP.NET은 jQuery를 내부에 제대로 컨트롤 ID를 렌더링합니다.

4.그냥 함께 시도

그냥 함께 시도

$("._statusDDL").val("2");

하지와

$("._statusDDL").val(2);

5.이러한 솔루션은 목록 아래로 드롭의 각 항목 드롭 다운 목록에서의 위치에 관한 발 () 값이 있다고 가정하는 것.

이러한 솔루션은 목록 아래로 드롭의 각 항목 드롭 다운 목록에서의 위치에 관한 발 () 값이 있다고 가정하는 것.

상황이 그렇지 않은 경우 조금 더 복잡하다.

드롭 다운 목록의 선택된 인덱스를 읽으려면이를 사용합니다 :
```
$("#dropDownList").prop("selectedIndex");
```
드롭 다운 목록의 선택된 인덱스를 설정하려면이을 사용합니다 :
```
$("#dropDownList").prop("selectedIndex", 1);
```
소품 () 기능은 JQuery와 V1.6 이상이 필요합니다.

이제이 두 기능을 사용하는 방법을 살펴 보자.

당신을 치죠은 달 이름의 드롭 다운 목록을했다.
```
<select id="listOfMonths">
  <option id="JAN">January</option>
  <option id="FEB">February</option>
  <option id="MAR">March</option>
</select>
```
당신은 "이전의 달"및 목록 항목 아래 현재 선택된 드롭에서보고, 이전 / 다음 달에 변경 "다음달"버튼을 추가 할 수 있습니다 :
```
<button id="btnPrevMonth" title="Prev" onclick="btnPrevMonth_Click();return false;" />
<button id="btnNextMonth" title="Next" onclick="btnNextMonth_Click();return false;" />
```
그리고 여기이 버튼을 실행하는 것이다 자바 스크립트를이다 :
```
function btnPrevMonth_Click() {
    var selectedIndex = $("#listOfMonths").prop("selectedIndex");
    if (selectedIndex > 0) {
        $("#listOfMonths").prop("selectedIndex", selectedIndex - 1);
    }
}
function btnNextMonth_Click() {
    //  Note:  the JQuery "prop" function requires JQuery v1.6 or later
    var selectedIndex = $("#listOfMonths").prop("selectedIndex");
    var itemsInDropDownList = $("#listOfMonths option").length;

    //  If we're not already selecting the last item in the drop down list, then increment the SelectedIndex
    if (selectedIndex < (itemsInDropDownList - 1)) {
        $("#listOfMonths").prop("selectedIndex", selectedIndex + 1);
    }
}
```
내 사이트는 JSON 데이터를 드롭 다운 목록을 채우는 방법을 표시하는 데 유용합니다 :

http://mikesknowledgebase.com/pages/Services/WebServices-Page8.htm
6.몇 가지 솔루션을보고 한 후,이 날 위해 일했습니다.

몇 가지 솔루션을보고 한 후,이 날 위해 일했습니다.

나는 어떤 값을 하나의 드롭 다운 목록을 가지고 있고 그래서 먼저 내가 변수에 내 첫 번째 드롭 다운의 selectIndex을 넣어 ... 또 다른 드롭 다운 목록에서 같은 값을 선택합니다.
```
var indiceDatos = $('#myidddl')[0].selectedIndex;
```
그 후, 나는 나의 두 번째 드롭 다운 목록에서 해당 인덱스를 선택합니다.
```
$('#myidddl2')[0].selectedIndex = indiceDatos;
```
노트 :

나는이 짧은, 신뢰할 수있는 일반적이고 우아한 솔루션입니다 같아요.

때문에 내 경우에는, 내가 선택한 옵션의 데이터 속성 대신 value 속성을 사용하고 있습니다. 각 옵션에 대해 고유 한 값이없는 그렇다면, 위의 방법은 짧고 달콤한!
7.나는이 오래된 질문이다 알고 위의 방법은 몇 가지 경우를 제외하고 잘 작동합니다.

나는이 오래된 질문이다 알고 위의 방법은 몇 가지 경우를 제외하고 잘 작동합니다.

처럼
```
<select id="select_selector">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3">Item3</option>
<option value="4" selected="selected">Item4</option>
<option value="5">Item5</option>
</select>
```
항목 4 이제 브라우저에서 "선택한"와 같이 표시됩니다 그래서 당신이 사용하는 경우는, 위의 방법에 따라 대신 Item4.So의 선택으로 "항목 3"를 3으로 값을 변경하고 보여주고 싶은
```
jQuery("#select_selector").val(3);
```
당신은 "4"국지적 인 이유는 즉, 귀하의 HTML은 다음과 같을 것입니다 당신이 PHP 나 ASP에 하나의 데이터를 처리 할 때 browser.But 선택으로 그 항목 3, 당신이 선택한 가치를 찾을 수 있습니다 볼 수 있습니다.
```
<select id="select_selector">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3" selected="selected">Item3</option>
<option value="4" selected="selected">Item4</option>
<option value="5">Item5</option>
</select>
```
그리고 서버 측 언어에서 "4"로 마지막 값을 가져옵니다.

그래서 내 최종 솔루션 ON THIS 간주하다
```
newselectedIndex = 3;
jQuery("#select_selector option:selected").removeAttr("selected");
jQuery("#select_selector option[value='"+newselectedIndex +"']").attr('selected', 'selected');  
```
편집 : 주위에 작은 따옴표를 추가 "+ newselectedIndex +"그래서 같은 기능은 숫자가 아닌 값에 사용 될 수있다.

내가 할 것은 실제로 그래서, 선택한 속성을 제거하고 선택으로 다음 새 하나를합니다.

나는 y0mbo, @ISIK 등 @ @strager 같은 수석 프로그래머에서이에 대한 의견을 부탁드립니다
8.우리는 "데이터 분류"의 제목의 드롭 다운이있는 경우 :

우리는 "데이터 분류"의 제목의 드롭 다운이있는 경우 :
```
<select title="Data Classification">
    <option value="Top Secret">Top Secret</option>
    <option value="Secret">Secret</option>
    <option value="Confidential">Confidential</option>
</select>
```
우리는 변수에 그것을 얻을 수 있습니다 :
```
var dataClsField = $('select[title="Data Classification"]');
```
그런 다음 다른 변수에 우리가 드롭 다운 가지고 원하는 값을 넣어 :
```
var myValue = "Top Secret";  // this would have been "2" in your example
```
그리고 우리는 우리가 dataClsField에 넣어 필드를 사용할 수 있습니다, 그것은) (.prop 사용하여 선택 myValue에 대한 발견을하고합니다
```
dataClsField.find('option[value="'+ myValue +'"]').prop('selected', 'selected');
```
또는, 당신은 단지) (.val 사용하지만, 당신의 선택 수 있습니다. 이 드롭 다운에 클래스와 일치하고 괄호 안에 값에 따옴표를 사용하거나 우리가 이전에 설정 한 변수를 사용해야하는 경우에만 사용할 수 있습니다 :
```
dataClsField.val(myValue);
```
9.Ajax 호출에서 데이터를로드 할 때 나는이 여러 번에 실행할 수있다. 나도 .NET을 사용하고 jQuery를 선택기를 사용하는 경우는 클라이언트 ID로 조정 얻을 시간이 걸립니다. 당신이 발생하는과의 setTimeout 속성을 추가하는 것을 피하기 위해하는 문제를 해결하려면, 당신은 단순히 넣을 수 있습니다 "비동기 : false"를 Ajax 호출, 그리고 그것은 DOM을 추가하는 것을 다시 개체가 충분한 시간을 줄 것이다 선택합니다. 작은 샘플 아래 :

Ajax 호출에서 데이터를로드 할 때 나는이 여러 번에 실행할 수있다. 나도 .NET을 사용하고 jQuery를 선택기를 사용하는 경우는 클라이언트 ID로 조정 얻을 시간이 걸립니다. 당신이 발생하는과의 setTimeout 속성을 추가하는 것을 피하기 위해하는 문제를 해결하려면, 당신은 단순히 넣을 수 있습니다 "비동기 : false"를 Ajax 호출, 그리고 그것은 DOM을 추가하는 것을 다시 개체가 충분한 시간을 줄 것이다 선택합니다. 작은 샘플 아래 :
```
$.ajax({
    type: "POST",
    url: document.URL + '/PageList',
    data: "{}",
    async: false,
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (response) {
        var pages = (typeof response.d) == 'string' ? eval('(' + response.d + ')') : response.d;

        $('#locPage' + locId).find('option').remove();

        $.each(pages, function () {
            $('#locPage' + locId).append(
                $('<option></option>').val(this.PageId).html(this.Name)
            );
        });
    }
});
```
10.그냥 메모 - 나는 ASP.NET 클라이언트 ID에 의해 난독된다 잡아 항목에 jQuery를에 와일드 카드 선택기를 사용하고 -이 당신을 너무 도움이 될 수 있습니다 :

그냥 메모 - 나는 ASP.NET 클라이언트 ID에 의해 난독된다 잡아 항목에 jQuery를에 와일드 카드 선택기를 사용하고 -이 당신을 너무 도움이 될 수 있습니다 :
```
<asp:DropDownList id="MyDropDown" runat="server" />

$("[id* = 'MyDropDown']").append("<option value='-1'>&nbsp;</option>"); //etc
```
이 이름이 "ctl00 $ ctl00 $ ContentPlaceHolder1 $ ContentPlaceHolder1 $ MyDropDown"경우에도 귀하의 요소를 찾을 수 wildcard- 아이디 * 참고
11.나는 그렇게 같이, 클라이언트 ID를 얻기 위해 기능을 확장 사용

나는 그렇게 같이, 클라이언트 ID를 얻기 위해 기능을 확장 사용
```
$.extend({
    clientID: function(id) {
        return $("[id$='" + id + "']");
    }
});
```
그럼 당신은 이런 식으로 jQuery를에 ASP.NET 컨트롤을 호출 할 수 있습니다 :
```
$.clientID("_statusDDL")
```
12.또 다른 옵션은 .NET에서 제어 PARAM 된 ClientID = "정적"을 설정하는 것입니다 그리고 당신은 당신이 설정 한 ID로 JQuery와의 개체에 액세스 할 수 있습니다.

또 다른 옵션은 .NET에서 제어 PARAM 된 ClientID = "정적"을 설정하는 것입니다 그리고 당신은 당신이 설정 한 ID로 JQuery와의 개체에 액세스 할 수 있습니다.
13.
```
<asp:DropDownList id="MyDropDown" runat="server" />
```
사용 $는 ( "[이름 $ = 'MyDropDown를']를 선택합니다"). 발 ().
14.어떻게 드롭 다운 목록에 값을로드하거나 선택하는 값이 결정된다? 당신이 사용하는 Ajax를 수행하는 경우 선택이 값이 문제의 라인이 실행 된 시간에로드되지 않았기 때문에이 될 수 발생하기 전에, 그 이유는 지연이 필요합니다. 이 경고 조치가 부하 데이터에 대한 지연의 정도를 줄 것이기 때문에 당신이 상태를 설정하기 전에 줄에 경고 문을 넣을 때 일 이유도 설명 할 것입니다.

어떻게 드롭 다운 목록에 값을로드하거나 선택하는 값이 결정된다? 당신이 사용하는 Ajax를 수행하는 경우 선택이 값이 문제의 라인이 실행 된 시간에로드되지 않았기 때문에이 될 수 발생하기 전에, 그 이유는 지연이 필요합니다. 이 경고 조치가 부하 데이터에 대한 지연의 정도를 줄 것이기 때문에 당신이 상태를 설정하기 전에 줄에 경고 문을 넣을 때 일 이유도 설명 할 것입니다.

당신이 jQuery의 아약스 방법 중 하나를 사용하는 경우 콜백 함수를 지정한 다음 ( "._ statusDDL") $를 넣을 수 있습니다 발 (2).; 콜백 함수에.

당신이 데이터를 준비 할 때 메서드가 실행 확신 할 수 있기 때문에 이것은 300 밀리 초보다 더 오래 걸렸다하더라도,이 문제를 처리하는 더 신뢰할 수있는 방법이 될 것입니다.

15.

<asp:DropDownList ID="DropUserType" ClientIDMode="Static" runat="server">
     <asp:ListItem Value="1" Text="aaa"></asp:ListItem>
     <asp:ListItem Value="2" Text="bbb"></asp:ListItem>
</asp:DropDownList>

ClientIDMode = "정적"

$('#DropUserType').val('1');

16.내 경우에는 나는 그것이 .attr () 메소드를 사용하여 작업을 얻을 수 있었다.

내 경우에는 나는 그것이 .attr () 메소드를 사용하여 작업을 얻을 수 있었다.
```
$("._statusDDL").attr("selected", "");
```
17.CSS 선택기를 사용하여 현대적인 브라우저의 순수한 JS에 대한 문제가되지 않습니다

CSS 선택기를 사용하여 현대적인 브라우저의 순수한 JS에 대한 문제가되지 않습니다
```
document.querySelector('._statusDDL').value = 2;
```
함수의 변화 () { . document.querySelector ( '._ statusDDL') 값 = 2; } <선택 클래스 = "_ statusDDL"> <옵션 값 = "1"을 선택>은 <옵션 값 = "2"> B <옵션 값 = "3"> C <버튼의 onclick = "변화 ()"> 변경

from https://stackoverflow.com/questions/499405/change-the-selected-value-of-a-drop-down-list-with-jquery by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 당신은 아이 패드에 HTML5 비디오를 자동으로 재생 할 수 있나요? (0)	2020.09.28
[JQUERY] AJAX는 페이지 새로 고침없이 PHP로 폼 데이터를 전달하여 양식 제출 (0)	2020.09.28
[JQUERY] 정규식 문자 브래킷 하이픈 포함? (0)	2020.09.28
[JQUERY] 동적 내부 JS JS로드 [중복] (0)	2020.09.28
[JQUERY] 선택의 onChange의 가치를 jQuery를 (0)	2020.09.28

복붙노트

[JQUERY] jQuery로 드롭 다운 목록의 선택 값을 변경

jQuery로 드롭 다운 목록의 선택 값을 변경

해결법

1.jQuery의 문서 상태 :

2.숨겨진 필드를 사용하면이 같은 사용해야합니다 :

3.그냥 참고로, 당신은이 작업을 수행 할 CSS 클래스를 사용할 필요가 없습니다.

4.그냥 함께 시도

5.이러한 솔루션은 목록 아래로 드롭의 각 항목 드롭 다운 목록에서의 위치에 관한 발 () 값이 있다고 가정하는 것.

6.몇 가지 솔루션을보고 한 후,이 날 위해 일했습니다.

7.나는이 오래된 질문이다 알고 위의 방법은 몇 가지 경우를 제외하고 잘 작동합니다.

8.우리는 "데이터 분류"의 제목의 드롭 다운이있는 경우 :

10.그냥 메모 - 나는 ASP.NET 클라이언트 ID에 의해 난독된다 잡아 항목에 jQuery를에 와일드 카드 선택기를 사용하고 -이 당신을 너무 도움이 될 수 있습니다 :

11.나는 그렇게 같이, 클라이언트 ID를 얻기 위해 기능을 확장 사용

12.또 다른 옵션은 .NET에서 제어 PARAM 된 ClientID = "정적"을 설정하는 것입니다 그리고 당신은 당신이 설정 한 ID로 JQuery와의 개체에 액세스 할 수 있습니다.

13.

15.

16.내 경우에는 나는 그것이 .attr () 메소드를 사용하여 작업을 얻을 수 있었다.

17.CSS 선택기를 사용하여 현대적인 브라우저의 순수한 JS에 대한 문제가되지 않습니다

'JQUERY' 카테고리의 다른 글

티스토리툴바