jQuery自动完成性能随着每次搜索而下降
我遇到了jQuery Autocomplete插件的问题。
通过使用术语“item”搜索多次，首先它可以正常工作：鼠标hover时的css类很好地添加，一切都很顺利。 通过单击弹出窗口外部关闭它并在每次所有内容似乎工作较慢时再次键入：
我在Chrome上进行了测试，速度非常慢，在Firefox上看起来处理得更好但性能也有所下降。
这是一个非常简单的代码： https ： //jsfiddle.net/re9psbxy/1/
和代码：
var suggestionList = []; for (var i = 0; i < 200; i++) { suggestionList.push({ label: 'item' + i, value: i }); } //initialize jQueryUI Autocomplete jQuery('#autocomplete').autocomplete({ source: suggestionList }); HTML：
我在其中一个应用上遇到了与自动完成相同的问题。 第一次打开时，自动完成function会非常快，但几次之后就变得无用了。 问题似乎是菜单小部件中的内存泄漏，自动完成似乎正在使用。 您可以通过将此问题添加到自动填充的搜索function来查看问题：
search: function(e,ui){ console.log($(this).data("ui-autocomplete").menu.bindings.length); }
每次搜索时，您都会看到绑定的长度继续增长。 要解决此问题，请在每次搜索时清除绑定：
search: function(e,ui){ $(this).data("ui-autocomplete").menu.bindings = $(); }
我把这个建议的工作发布到open jquery ui bug： https ： //bugs.jqueryui.com/ticket/10050
我遇到了一个类似的问题，但它是自动完成的焦点事件导致它自己构建。 我能够利用以下方法解决它
self.search_element.autocomplete({ minLength:0, source: function(request, response) { response(data); }, delay: 100, //for some reason some values were not being inserted correctly, so i placed this delay here autoFocus: true, select: function(event, ui) { self.emit('select', ui); }, search: function(e,ui) { $(this).data("ui-autocomplete").menu.bindings = $(); $( this ).off("focus"); self.search_element.on("focus", function() { $(this).data("uiAutocomplete").search($(this).val()); }); } });
每次触发搜索事件时，我都会根据此处的错误删除绑定， https：//bugs.jqueryui.com/ticket/15095 。 然后我取消绑定焦点事件，并重新绑定它以确保它只为该搜索绑定一次。
希望这可以在焦点事件出现问题时帮助某人。