У меня есть переменная JavaScript, которая содержит массив слов словаря, таких как
var words = ['and','cat', n1, n2, n3 and so on ]
Этот массив содержит около 58020 слов.
Я создал автозаполненный плагин jQuery, который отображает слова из массива словаря в раскрывающемся списке, когда пользователь начинает вводить текст в текстовое поле. Но браузер падает в какой-то момент, потому что я думаю, что цикл по каждому слову замедляет процесс.
Как я могу преодолеть это?
Вот функция, которая проверяет массив слов и выводит слова, если они найдены
$(textInput).keyup(function(e) {
var text = $(this).val();
var foundTag = false;
for (var i = 0; i < settings.tags.length; i++) {
var tagName = settings.tags[i].toLowerCase();
if (tagName.startsWith(text)) {
if (text != '') {
foundTag = true;
$(settings.tagContainer).append(GetDivDropDownItem(settings.tags[i]));
}
else {
}
}
}
});
Редактировать
$(textInput).keyup(function(e) {
var text = $(this).val();
var foundTag = false;
for (var i = 0; i < settings.words.length; i++) {
var tagName = settings.words[i].toLowerCase();
if (tagName.startsWith(text)) {
if (text != '') {
foundTag = true;
$(settings.tagContainer).append(GetDivDropDownItem(settings.words[i]));
}
else {
}
}
}
});
var GetDivDropDownItem = function(text) {
var cWidth = $(container).css("width");
cWidth = cWidth.split("px")[0];
var tag = $("<div/>");
$(tag).css("paddingLeft", "5px");
$(tag).css("paddingRight", "5px");
$(tag).css("paddingBottom", "5px");
$(tag).css("paddingTop", "5px");
$(tag).css("width", cWidth - 10);
$(tag).css("float", "left");
$(tag).css("fontFamily", "Arial");
$(tag).css("fontSize", "12px");
$(tag).css("color", "#6A6B6C");
$(tag).text(text);
return $(tag);
};