옵션 추가

옵션 추가jQuery를 사용하십니까? jQuery를 사용하여 드롭 다운에 옵션을 추가하는 가장 쉬운 방법은 무엇입니까? 작동할까요? $ ( "# mySelect"). append ( '<option value = 1> 내 옵션 </ option>'); 이것은 IE8에서 작동하지 않았습니다 (아직 FF에서는 작동했습니다) : $ ( "# selectList"). append (new Option ( "option text", "value")); 이 DID는 작동합니다. var o = new Option ( "option text", "value"); /// DOM 객체 'o'를 jquerify하여 html 메소드를 사용할 수 있습니다. $ (o) .html ( "option text"); $ ( "# selectList"). append (o); 개인적으로 옵션을 추가하는 데 다음 구문을 선호합니다. $ ( '# mySelect'). append ($ ( '<option>', {value : 1, text : 'My option'})); 항목 모음에서 옵션을 추가하는 경우 다음을 수행 할 수 있습니다. $ .each (items, function (i, item) {$ ( ' #mySelect '). append ($ ('<option> ', {value : item.value, text : item.text})); }); 다음 구문을 사용하여 옵션을 추가 할 수 있으며, 자세한 내용은 jQuery의 방법 핸들 옵션을 참조하십시오. $ ( '# select'). append ($ ( '<옵션>', {value : 1, text : 'One'})); $ ( '# select'). append ( '<option value = "1"> 하나 </ option>'); var option = new Option (텍스트, 값); $ ( '# select'). append ($ (옵션)); 옵션 이름이나 값이 동적이면 그 안의 특수 문자 이스케이프에 대해 걱정할 필요가 없습니다. 여기에서는 간단한 DOM 메소드를 선호 할 수 있습니다. var s = document.getElementById ( 'mySelect'); s.options [s.options.length] = new Option ( '내 옵션', '1'); 옵션 1- $ ( '# selectID') 시도해 볼 수 있습니다. append ($ ( '<옵션>', {value : value_variable, text : text_variable})); 다음과 같이-for (i = 0; i <10; i ++) {$ ( '# mySelect'). append ($ ( '<option>', {value : i, text : "Option"+ i})); } <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"> </ script> <select id = 'mySelect'> </ select> 옵션 2- 또는 이것을 시도하십시오-$ ( '# selectID'). append ( '<option value = "'+ value_variable + '">'+ text_variable + '</ option>'); 이와 같이-for (i = 0; i <10; i ++) {$ ( '# mySelect'). append ( '<option value = "'+ i + '">'+ 'Option'+ i + '</ option> '); } <script src = "https : label '] +'</ option> '); } $ ( '# select'). append (html); $ ( '# mySelect'). empty (). append ( '<option value = 1> 내 옵션 </ option>'). selectmenu ( 'refresh'); 비 jquery 접근 방식을 사용하고 싶습니다 : mySelect.add (new Option ( 'My option', 1)); 이것은 매우 간단한 것입니다. 이렇게하면 $ ( '# select_id'). append ( '<option value = "five"selected = "selected"> Five </ option>'); 또는 $ ( '# select_id'). append ($ ( '<option>', {value : 1, text : 'One'})); 아래 예와 같이 드롭 다운에 동적으로 옵션을 추가 할 수 있습니다. 이 예에서는 출력 스크린 샷 출력에 표시된대로 배열 데이터를 가져 와서 해당 배열 값을 드롭 다운에 바인딩했습니다. var resultData = [ "Mumbai", "Delhi", "Chennai", "Goa"] $ (document) .ready (function () {var myselect = $ ( '<select>'); $ .each (resultData, function (index, key) {myselect.append ($ ( '<option> </ option>'). val (key) .html (key));}); $ ( '# selectCity'). append (myselect.html ());}); <script src = "https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"> </ script> <select id = "selectCity"> </ select> 언급되지 않음 대답은 유용하지만 해당 옵션을 선택하려는 경우 다음을 추가 할 수 있습니다. var o = new Option ( "option text", "value"); o.selected = true; $ ( "# mySelect"). append (o); var select = $ ( '# myselect'); var newOptions = { 'red': 'Red', 'blue': 'Blue', 'green': 'Green', 'yellow': '노란색'}; $ ( '옵션', 선택) .remove (); $ .each (newOptions, function (text, key) {var option = new Option (key, text); select.append ($ (option));}); 두 가지 방법이 있습니다. 이 두 가지 중 하나를 사용할 수 있습니다. 첫 번째 : $ ( '# waterTransportationFrom'). append ( '<option value = "select"selected = "selected"> 드롭 다운 목록에서 선택 </ option>'); 두 번째 : $ .each (dataCollecton, function (val, text) {options.append ($ ( '<option> </ option>'). val (text.route) .html (text.route));}); 선택의 특정 색인에 새 옵션을 삽입하려면 다음을 수행하십시오. $ ( "# my_select option"). eq (2) .before ($ ( '<option>', {value : 'New Item', text : 'New Item'})); 그러면 선택에서 세 번째 항목으로 "새 항목"이 삽입됩니다. 다음과 같은 텍스트로 Value 속성을 추가하고 설정할 수 있습니다. $ ( "# id"). append ($ ( '<option> </ option>'). attr ( "value", '') .text ( '')) ; $ ( "# id"). append ($ ( '<option> </ option>'). attr ( "value", '4'). text ( 'Financial Institutions')); 옵션을 추가하고 jquery validate를 사용할 때 몇 가지 문제를 발견했습니다. 다중 선택 목록에서 하나의 항목을 클릭해야합니다. 처리 할 다음 코드를 추가합니다. $ ( "# phonelist"). append ( "<option value = '"+'yournewvalue '+ "'>"+ 'yournewvalue'+ "< 루프 내부에 선택기가 없습니다 (최상의 성능을 위해) str + = "<option value = '"+ item.value + "'>"+ item.text + "</ option>"; }); // 큰 문자열을 만들었습니다. $ mySelect.html (str); // <-여기에서 많은 옵션이있는 큰 문자열을 선택기에 추가합니다. $ mySelect.multiSelect ( '새로 고침'); 더 빠른 var str = ""; for (var i; i = 0; i <arr.length; i ++) {str + = "<option value = '"+ item [i] .value + "'>"+ item [i] .text + "< / 옵션> "; } $ mySelect.html (str); $ mySelect.multiSelect ( '새로 고침'); 항목 모음 추가에 대한 dule의 답변에 따라 ... in에 대한 한 줄짜리도 놀라운 작업을 수행 할 수 있습니다. let city = { 'ny': 'New York', 'ld': 'London', 'db': ' Dubai ','pk ':'Beijing ','tk ':'Tokyo ','nd ':'New Delhi '}; for (let c in 도시) {$ ( '# selectCity'). append ($ ( '<option>', {value : c, text : 도시 [c]}))} <script src = "https : // ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js "> </ script> <select id ="selectCity "> </ select> 객체 값과 색인 모두 옵션에 할당됩니다. 이 솔루션은 이전 jQuery (v1.4)에서도 작동합니다! select 안에 optgroup이 있으면 DOM에 오류가 있습니다. 가장 좋은 방법은 다음과 같습니다. $ ( "# select option : last"). after ($ ( '<option value = "1"> my option </ option>')); 아래 코드를 <select id = "mySelect"> </ select> <script> $ ( "# mySelect") 옵션에 추가 할 수 있습니다. append ($ ( "<옵션> </ option>"). val ( "1"). html ( "여기에 코드 입력 option")); </ script> $ ( '# select_id'). append ($ ( '<option>', {value : v, text : t})); 이것은 각 선택 태그를 추가하는 버튼으로 내가 한 방식입니다. $ (document) .on ( "click", "# button", function () {$ ( '# id_table_AddTransactions'). append ( '<option> </ option>')} $ (function () {var option = $ ( "<option> </ option>"); option.text ( "Display text"); option.val ( "1"); $ ( "# Select1"). append (option);}); 어떤 객체에서 데이터를 가져온 다음 해당 객체를 함수로 전달합니다 ... $ (function (product) {var option = $ ( "<option> </ option>"); option.text (product.Name); option.val (product.Id); $ ( "# Select1"). append (옵션); }); Name과 Id는 객체 속성의 이름입니다 ... 그래서 원하는대로 호출 할 수 있습니다 ... 그리고 물론 Array가있는 경우 ... for 루프를 사용하여 사용자 지정 함수를 빌드하려는 경우 ... 다음에서 해당 함수를 호출합니다. 문서 준비 ... 건배 ES6에서이 작업을 수행 할 수 있습니다. $ .each (json, (i, val) => {$ ( '. js-country-of-birth'). append (`<option value = "$ {val.country_code} "> $ {val.country} </ option>`);}); 누군가 데이터 속성을 사용하여 옵션을 추가하는 방법을 찾고 있다면 attr var option = $ ( '<option>', {value : 'the_value', text : 'some text'}). attr ( 'family', model 사용 .가족); 데이터 사용-버전 추가 1.2.3 var option = $ ( '<option>', {value : 'the_value', text : ' 일부 텍스트 '}). data ('misc ','misc-value); 참고 URL : https://stackoverflow.com/questions/740195/adding-options-to-a-select-using-jquery