Вопрос

Я пытаюсь заполнить раскрывающееся меню. Я делаю 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).

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top