Question

我允许用户搜索列表框，该列表框缩小了所述列表框中包含的结果。

ajax请求快速返回结果，chrome可以快速添加结果。问题出在我实际清空列表框的中间步骤。

以下是代码：

function PopulateListBox(data, listBox) {

    var options = '';
    if (data != null) {
        for (var i = 0; i < data.length; i++) {
            options += "<option value=\"" + data[i].Id + "\">" + data[i].Name + '</option>';
        }
    }
    listBox.empty().append(options);
}

其中data是一个JSON数组，listbox是一个jquery选择器，带有一个列表框的ID（选择器是ID，例如$('#listbox')。列表框中有大约5-10k个选项。

Firefox甚至IE都能很好地解决这个问题，但是Chrome很糟糕（“最快的js引擎”google发生了什么？）。

我正在使用最新的jquery（1.5.1）和Chrome 11.0.696.3 dev。（我也使用FF 3.6和IE 8）

Answer 1

使用html()方法代替empty()后跟append()可能会更快：

listBox.html(options);

Answer 2

出于好奇，你试过replaceWith吗？（docs在这里。）你需要有一个div包装你的listBox，那就是你传递给PopulateListBox函数的那个。您还需要手动将options变量与列表框的开始和结束标记信息包装在一起（如下所示为伪html）：

...
options = "<listbox tag>" + options + "</listbox tag>";
listBoxWrapperDiv.replaceWith(options);
...

Chrome通过jquery清空我的列表框真的很慢

2 个答案: