javascript - 动态添加9000选项以在javascript中进行选择以在IE上花费太长时间

如果有人帮助我创建优化的代码以动态添加9000+选项以选择框，我将不胜感激。基本上，为了简化每个选项，我将文本和值都保留为for循环的索引。

我尝试了很多选择，例如:

为所有9000条记录一次创建选项元素字符串，然后同时使用jquery和普通javascript添加到select元素

2。

for loop {
    options[options.length] = new Option(text, value);
}

然后:

selectElement.options.add(options);

3。

var objOption = document.createElement("option");
objOption.value = value;
objOption.text = text;
htmlElement.options.add(objOption);

这些片段几乎都花了相同的时间。有什么方法可以在2-3秒内完成？

最佳答案

好吧，您说您已经尝试添加字符串，并且说实话，9000个选项很多。我建议使用chosen-select之类的东西，以增加如此庞大的选择的可用性。

无论如何，我试图以一种简单的方式修改选择，并且它的运行速度非常快。

检查此jsFiddle。

它的作用是使用html() jQuery方法将选项添加为字符串。

// number of options to insert
var noptions = 9000;

// number of current options
var nOpts = $('#huge_select option').length;

// current options html
var options = $('#huge_select').html();
for (var i = 0; i < noptions; ++i) {
    // add the html options to the current set
    options += "<option value='"+(i+nOpts)+"'>"+(i+nOpts)+"</option>";
}
// set the select html
$('#huge_select').html(options);