Удаление опций из выбора в IE6
-
10-07-2019 - |
Вопрос
Я пытаюсь заполнить раскрывающееся меню. Я делаю Ajax-вызов для получения myList. Когда у меня есть новый список, я удаляю все опции из элемента select и вставляю новые значения (около 100 опций). Это прекрасно работает в более поздних версиях IE и Firefox; обновление почти мгновенно. Однако в IE6 эти операции действительно замедляют работу браузера. Раскрывающийся список почти становится анимированным, когда из него удаляются параметры, и это продолжается в течение нескольких секунд. Есть ли способ ускорить это, не сравнивая старый список с новым и только удаляя / добавляя измененные элементы?
$("#myselect").children.remove();
$.each(myList, function(i, val) {
$("<option>").attr("value", val.myID)
.text(val.myText)
.appendTo("#myselect");
});
Решение
Что если вы создадите новый элемент и отключите его?
var newSelect = $("<select></select>");
$.each(myList, function(i, val) {
$("<option>").attr("value", val.myID)
.text(val.myText)
.appendTo(newSelect);
});
$("#myselect").replaceWith(newSelect);
Другие советы
Хотя ваш код намного приятнее, но если он слишком медленный, перейдите по прямому маршруту (я делал это раньше, до использования jQuery, и это было мгновенно во всех браузерах, включая IE6). Просто удалите все дочерние элементы из выбора, удалив HTML:
$("#myselect").html('');
И измените цикл так, чтобы вы создали html для каждого параметра и вставили его в выборку с помощью
$('#myselect').html(optionsHTML);
В зависимости от производительности вы можете попытаться найти золотую середину между этим решением и решением karim79 (то есть удалите параметры с помощью html () и добавьте их, используя массив вместо создания простого HTML).