在html中一次追加多个选项选择

Append multiple options in html select at once

本文关键字：追加 选项 选择 一次 html      更新时间：2023-09-26

我想在html select中附加多个选项。

目前我在循环中使用下面的代码，但这会使工作变得缓慢，因为每次都必须添加新的选项。

代码段：

s.options[s.options.length]= new Option(url, '1');

所以我想，如果我能一次添加所有选项，而不是像上面那样一个接一个地添加，也许它会更快。

请建议一个比这个更快的函数。感谢

试试这个，

s.options[s.options.length]=函数选项（url，'1'）{//此处显示语句}；

您可以使用DocumentFragment来完成此操作，但我不确定是否支持浏览器。它当然适用于所有浏览器的当前版本（包括IE 10），但我怀疑它是否适用于旧的IE

var frag = document.createDocumentFragment();
for (var i = 0; i < 10; ++i) {
    var option = document.createElement("option");
    option.value = "" + i;
    option.text = "Option " + i;
    frag.appendChild(option);
}
s.appendChild(frag);

演示：http://jsfiddle.net/QsNpe/

试试这个：

var tmpOptions = [];
for(var i=0; i<optionsLength; i++) {
    tmpOptions[i] = new Option(url, i);
}
s.options = tmpOptions;

尝试这个

var dataArr = [{'value':'val1','text':'text1'},
               {'value':'val2','text':'text2'},
               {'value':'val3','text':'text3'},
               {'value':'val4','text':'text4'},
               {'value':'val5','text':'text5'},
               {'value':'val6','text':'text6'},
               {'value':'val7','text':'text7'}];
// Removes all options for the select box
$('#optExample option').remove();
// .each loops through the array
$.each(dataArr, function(i){
    $('#optExample').append($("<option></option>")
                    .attr("value",dataArr[i]['value'])
                    .text(dataArr[i]['text']));
});
相关文章：