blocks|key|1820630|text|不要让你的代码变得如此复杂。通过使用一个类似foreach的迭代器，可以简单地完成如下操作：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1820631|$.each(buildings,+function+(index,+value)+{
++++$('#dropListBuilding').append($('<option/>',+{+
++++++++value:+value,
++++++++text+:+value+
++++}));
});++++++|code-block|syntax|javascript|1820632|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Don't make your code so complicated. It can be done simply as below by using a foreach-like iterator: 

<pre><code>$.each(buildings, function (index, value) {
 $('#dropListBuilding').append($('&lt;option/&gt;', { 
 value: value,
 text : value 
 }));
}); 
</code></pre>

blocks|key|1820448|text|$('#dropListBuilding').append('<option>'%2Bval%2B'</option>');|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1820449|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>$('#dropListBuilding').append('&lt;option&gt;'+val+'&lt;/option&gt;');
</code></pre>

blocks|key|2034071|text|这样做对我来说一直很管用，我希望这对我有帮助。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2034072|var+ddl+=+$("#dropListBuilding");+++
for+(k+=+0;+k+<+buildings.length;+k%2B%2B)
+++ddl.append("<option+value='"+%2B+buildings[k]%2B+"'>"+%2B+buildings[k]+%2B+"</option>");|code-block|syntax|javascript|2034073|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

Doing it this way has always worked for me, I hope this helps.

<pre><code>var ddl = $("#dropListBuilding"); 
for (k = 0; k &lt; buildings.length; k++)
 ddl.append("&lt;option value='" + buildings[k]+ "'&gt;" + buildings[k] + "&lt;/option&gt;");
</code></pre>

blocks|key|2034130|text|您的代码失败，因为您正在对jQuery对象执行方法(addOption)+(而此对象不支持该方法)|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2034131|您可以像这样使用标准的Javascript函数：|2034132|$("#dropListBuilding")[0].options.add(+new+Option("My+Text","My+Value")+)|code-block|syntax|javascript|2034133|entityMap^0|0|0|0^^$0|@$1|2|3|4|5|6|7|K|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|L|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|M|8|@]|9|@]|A|$G|H]]|$1|I|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|J|$]]

Your code fails because you are executing a method (addOption) on the jQuery object (and this object does not support the method)

You can use the standard Javascript function like this:

<pre><code>$("#dropListBuilding")[0].options.add( new Option("My Text","My Value") )
</code></pre>

blocks|key|1820760|text|$.each(data,function(index,itemData){
++++$('#dropListBuilding').append($("<option></option>")
++++++++.attr("value",key)
++++++++.text(value));+
});|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|1820761|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>$.each(data,function(index,itemData){
 $('#dropListBuilding').append($("&lt;option&gt;&lt;/option&gt;")
 .attr("value",key)
 .text(value)); 
});
</code></pre>

blocks|key|1820513|text|看起来你想要这个插件，因为它遵循你现有的代码，也许插件js文件被遗漏在了什么地方。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1820514|http://www.texotela.co.uk/code/jquery/select/|offset|length|1820515|var+myOptions+=+{
"Value+1"+:+"Text+1",
"Value+2"+:+"Text+2",
"Value+3"+:+"Text+3"
}+
$("#myselect2").addOption(myOptions,+false);+
//+use+true+if+you+want+to+select+the+added+options+»+Run|code-block|syntax|javascript|1820516|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|19|0|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|S|8|@]|9|@$D|T|E|U|1|V]]|A|$]]|$1|F|3|G|5|H|7|W|8|@]|9|@]|A|$I|J]]|$1|K|3|-4|5|6|7|X|8|@]|9|@]|A|$]]]|L|$M|$5|N|O|P|A|$Q|C]]]]

It looks like you want this pluging as it follows your existing code, maybe the plug in js file got left out somewhere. 

<a href="http://www.texotela.co.uk/code/jquery/select/" rel="nofollow noreferrer">http://www.texotela.co.uk/code/jquery/select/</a>

<pre><code>var myOptions = {
"Value 1" : "Text 1",
"Value 2" : "Text 2",
"Value 3" : "Text 3"
} 
$("#myselect2").addOption(myOptions, false); 
// use true if you want to select the added options » Run
</code></pre>

blocks|key|1820570|text|这个很好用，试试这个。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1820571|var+ob+=+$("#myListBox");

for+(var+i+=+0;+i+<+buildings.length;+i%2B%2B)+{
+++++var+val+=+buildings[i];
+++++var+text+=+buildings[i];

+++++ob.prepend("<option+value="%2B+val+%2B">"+%2B+text+%2B+"</option>");
}|code-block|syntax|javascript|1820572|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

This is working fine, try out this.

<pre><code>var ob = $("#myListBox");

for (var i = 0; i &lt; buildings.length; i++) {
 var val = buildings[i];
 var text = buildings[i];

 ob.prepend("&lt;option value="+ val +"&gt;" + text + "&lt;/option&gt;");
}
</code></pre>

blocks|key|1820610|text|如果你不想依赖jQuery的3.5HTML插件，或者不想在转义保留的kB字符时构造jQuery字符串，这里有一个简单的方法：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|1820611|function+addOptionToSelectBox(selectBox,+optionId,+optionText,+selectIt)
{
++++var+option+=+document.createElement("option");
++++option.value+=+optionId;
++++option.text+=+optionText;
++++selectBox.options[selectBox.options.length]+=+option;
++++if+(selectIt)+{
++++++++option.selected+=+true;
++++}
}

var+selectBox+=+$('#veryImportantSelectBox')[0];
addOptionToSelectBox(selectBox,+"ID1",+"Option+1",+true);|code-block|syntax|javascript|1820612|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

If you do not want to rely on the 3.5 kB plugin for jQuery or do not want to construct the HTML string while escapping reserved HTML characters, here is a simple way that works:

<pre><code>function addOptionToSelectBox(selectBox, optionId, optionText, selectIt)
{
 var option = document.createElement("option");
 option.value = optionId;
 option.text = optionText;
 selectBox.options[selectBox.options.length] = option;
 if (selectIt) {
 option.selected = true;
 }
}

var selectBox = $('#veryImportantSelectBox')[0];
addOptionToSelectBox(selectBox, "ID1", "Option 1", true);
</code></pre>

blocks|key|2034357|text|对我来说，这个方法很有效。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2034358|success:+function(data){
++++++++++++alert("SUCCCESS");
++++++++++++$.each(data,function(index,itemData){
++++++++++++++++console.log(JSON.stringify(itemData));
++++++++++++++++$("#fromDay").append(+new+Option(itemData.lookupLabel,itemData.id)+)
++++++++++++});
++++++++}|code-block|syntax|javascript|2034359|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

For me this one worked

<pre><code>success: function(data){
 alert("SUCCCESS");
 $.each(data,function(index,itemData){
 console.log(JSON.stringify(itemData));
 $("#fromDay").append( new Option(itemData.lookupLabel,itemData.id) )
 });
 }
</code></pre>

My select list is called <code>dropListBuilding</code>. The following code does not seem to work:

<pre><code> for (var i = 0; i &lt; buildings.length; i++) {
 var val = buildings[i];
 var text = buildings[i];
 alert("value of builing at: " + i.toString() + " is: " + val);
 $("#dropListBuilding").addOption(val, text, false);
 }
</code></pre>

This line dies: 

<pre><code>$("#dropListBuilding").addOption(val, text, false);
</code></pre>

What is the right to add items to the drop down in jQuery? I have tested without that line and the buildings variable does have my data element.

How to add option to select list in jQuery

jQuery

JSON

我的选择列表名为dropListBuilding。以下代码似乎不起作用： for (var i = 0; i < buildings.length; i++) { var val = buildings[i]; var text = buildings[i]; alert("value of builing at: " + i.toString() + " is: " +

问如何在jQuery中为选择列表添加选项
EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jQuery中为选择列表添加选项EN

回答 9

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jQuery中为选择列表添加选项
EN