[JQUERY] 어떻게 jQuery를 사용하여 DropDownList로에 옵션을 추가하는 방법은 무엇입니까?

어떻게 jQuery를 사용하여 DropDownList로에 옵션을 추가하는 방법은 무엇입니까?

해결법

1. ---

   1.여분의 플러그인을 사용하지 않고,

   여분의 플러그인을 사용하지 않고,

   var myOptions = {
       val1 : 'text1',
       val2 : 'text2'
   };
   var mySelect = $('#mySelect');
   $.each(myOptions, function(val, text) {
       mySelect.append(
           $('<option></option>').val(val).html(text)
       );
   });
   

   당신은 많은 옵션을 가지고, 또는이 코드는 매우 자주 실행하는 데 필요한 경우, 당신은의 DocumentFragment를 사용하는 대신에 많은 시간을 불필요하게 DOM을 수정로 보일 것입니다. 옵션의 소수를 들어, 나는 그것이 비록 가치가 없어 말할 것입니다.

   ------------------------------- 추가 ------------------ --------------

   DocumentFragment가 속도 향상을위한 좋은 방법입니다,하지만 우리는 IE6와 IE7이 지원되지 않기 때문에 document.createElement ( '옵션')를 사용하여 옵션 요소를 만들 수 없습니다.

   우리가 할 수있는 모든 옵션을 추가 한 후 새로운 선택 요소를 만들고있다. 루프가 완료되면, 실제 DOM 객체에 추가합니다.

   var myOptions = {
       val1 : 'text1',
       val2 : 'text2'
   };
   var _select = $('<select>');
   $.each(myOptions, function(val, text) {
       _select.append(
               $('<option></option>').val(val).html(text)
           );
   });
   $('#mySelect').append(_select.html());
   

   우리가 한 번만 DOM을 수정할 수 있습니다이 방법!

2. ---

   2.플러그인없이, 이것은 많은 jQuery를 같이 사용하는 대신 약간 더 올드 스쿨을 거치지 않고 쉽게 할 수 있습니다 :

   플러그인없이, 이것은 많은 jQuery를 같이 사용하는 대신 약간 더 올드 스쿨을 거치지 않고 쉽게 할 수 있습니다 :

   var myOptions = {
       val1 : 'text1',
       val2 : 'text2'
   };
   $.each(myOptions, function(val, text) {
       $('#mySelect').append( new Option(text,val) );
   });
   

   지금 선택해야합니다) 기본 선택 값이고, B 여부 옵션 A)를 지정하려는 경우, 당신은 두 개 이상의 매개 변수를 전달할 수 있습니다 :

       var defaultSelected = false;
       var nowSelected     = true;
       $('#mySelect').append( new Option(text,val,defaultSelected,nowSelected) );
   

3. ---

   3.jQuery를 선택 상자 : 플러그인으로. 이 작업을 수행 할 수 있습니다 :

   jQuery를 선택 상자 : 플러그인으로. 이 작업을 수행 할 수 있습니다 :

   var myOptions = {
           "Value 1" : "Text 1",
           "Value 2" : "Text 2",
           "Value 3" : "Text 3"
       }
       $("#myselect2").addOption(myOptions, false); 
   

4. ---

   4.먼저 드롭 다운을 취소 할 수 있습니다 $ ( '#의 DropDownQuality') 비우 ().;

   먼저 드롭 다운을 취소 할 수 있습니다 $ ( '#의 DropDownQuality') 비우 ().;

   나는 MVC 내 컨트롤러는 하나 개의 항목과 선택 목록을 반환했다.

   $('#DropDownQuality').append(
           $('<option></option>').val(data[0].Value).html(data[0].Text));    
   

5. ---

   5.처음에 목록에 항목 추가

   처음에 목록에 항목 추가

   $("#ddlList").prepend('<option selected="selected" value="0"> Select </option>');
   

   결국 목록에 항목 추가

   $('<option value="6">Java Script</option>').appendTo("#ddlList");
   

   jQuery를 사용하여 일반적인 드롭 다운 조작 (가져 오기, 설정, 추가, 제거)

6. ---

   6.Phrogz의 솔루션 @ 피스 노트 @ nickf의 작동하는 동안 모든 주요 브라우저에서 IE 8에서 작동하지 않습니다. 또 다른 방법은 다음과 같습니다

   Phrogz의 솔루션 @ 피스 노트 @ nickf의 작동하는 동안 모든 주요 브라우저에서 IE 8에서 작동하지 않습니다. 또 다른 방법은 다음과 같습니다

   $.each(myOptions, function(val, text) {
       $("#mySelect").append($("<option/>").attr("value", val).text(text));
   });
   

7. ---

   7.U 직접 사용할 수 있습니다

   U 직접 사용할 수 있습니다

   $ "(. ddlClassName"). html로는 ( "<선택된 \"값 = \ "1 \ 옵션 = \ 선택된" "> 1 <\ = 옵션 값을 '2 \"> 2 ")

   -> 여기에서 u는 직접 문자열을 사용할 수 있습니다

8. ---

   8.또한, 사용 .prepend ()는 옵션 목록의 시작에 옵션을 추가 할 수 있습니다. http://api.jquery.com/prepend/

   또한, 사용 .prepend ()는 옵션 목록의 시작에 옵션을 추가 할 수 있습니다. http://api.jquery.com/prepend/

9. ---

   9.당신이 사용할 수있는 JQuery와 사용

   당신이 사용할 수있는 JQuery와 사용

         this.$('select#myid').append('<option>newvalue</option>');
   

   "MYID"여기서 드롭 다운 목록의 ID이고 NEWVALUE가 삽입하려는 텍스트입니다 ..

10. ---

    10.내 페이지에 드롭 다운 있었다으로 드롭 다운에 많은 옵션으로 추가 할 필요가 있었다. 그래서 나는이 방법으로 그것을 사용 :

    내 페이지에 드롭 다운 있었다으로 드롭 다운에 많은 옵션으로 추가 할 필요가 있었다. 그래서 나는이 방법으로 그것을 사용 :

    function myAppender(obj, value, text){
        obj.append($('<option></option>').val(value).html(text));
    }
    
    $(document).ready(function() {
        var counter = 0;
        var builder = 0;
        // Get the number of dropdowns
        $('[id*="ddlPosition_"]').each(function() {
            counter++;
        });
    
        // Add the options for each dropdown
        $('[id*="ddlPosition_"]').each(function() {
            var myId = this.id.split('_')[1];
    
            // Add each option in a loop for the specific dropdown we are on
            for (var i=0; i<counter; i++) {
                myAppender($('[id*="ddlPosition_'+myId+'"]'), i, i+1);
            }
            $('[id*="ddlPosition_'+myId+'"]').val(builder);
            builder++;
        });
    });
    

    이것은 동적 (즉, 2가 드롭 다운 상자 등의 "2"를 가지고)가 드롭이었다 순서 값을 자동으로 선택된 1 내지 N과 같은 값으로 드롭 다운을 설정하고.

    실제로 특정의 객체의 ID 다음 손잡이를받을 수 있도록 전달했다 ---하지만 내 2 .each ()에 같은이 나 this.Object 또는 $ .OBJ 또는 아무것도를 사용할 수 없다는 말도했다 이 추가 것이다 전에 내 기능에 전체 개체. 다행히 내 드롭 다운의 ID는 "_"로 구분하고 있었고, 난 그것을 잡을 수 있습니다. 나는에 있었다한다고 생각하지 않지만, 그렇지 않으면 내가 jQuery를 예외를주고 있었다. 내가 알고 즐길 수 무엇인지 고민 뭔가 다른 사람.

11. ---

    11.당신의 응답은 "successData"라고 생각 할 수 있습니다. 이렇게하면 드롭 다운 메뉴에서 옵션으로 추가해야 목록이 포함되어 있습니다.

    당신의 응답은 "successData"라고 생각 할 수 있습니다. 이렇게하면 드롭 다운 메뉴에서 옵션으로 추가해야 목록이 포함되어 있습니다.

    success: function (successData) {
    var sizeOfData = successData.length;
    if (sizeOfData == 0) {
        //    NO DATA, throw an alert ...
        alert ("No Data Found");
    } else {
        $.each(successData, function(val, text) {
            mySelect.append(
                $('<option></option>').val(val).html(text)
            );
        });
    } }
    

    이것은 당신을 위해 일 것입니다 ....

12. ---

    12.이 기능을 시도 :

    이 기능을 시도 :

    function addtoselect(param,value){
        $('#mySelectBox').append('<option value='+value+'>'+param+'</option>');
    }
    

from https://stackoverflow.com/questions/317095/how-do-i-add-options-to-a-dropdownlist-using-jquery by cc-by-sa and MIT license