Подтвердить что ты не робот

Bootstrap select loading занимает слишком много времени в IE

Я загружаю 1000 записей в раскрывающийся список выбора начальной загрузки. Это занимает около 2 секунд в Chrome, но занимает 30 секунд в IE 9. Кроме того, отменить или x из мода загрузочного мода в IE занимает 10 + с слишком. Вызов API одобрен, но рендеринг выполняется так медленно; Может ли кто-нибудь дать мне какое-то направление?

Итак, я загружаю список клиентов и устанавливаю выбранные. Вот код.

    var customerPicker = $('#customer-picker');
    API.getCustomers().then(function (result) {
        loadDropdown(customerPicker, result.customers); 

        // set the selected to current customer; it takes 10s in IE
        customerPicker.val(currentCustomerId).selectpicker('refresh'); 

        // it takes about 10s in IE too. selector is the bs modal div
        $(selector).css('z-index', '1060').modal('show'); 
    }).catch(function (errorMessage) {
        ToastManager.showError(errorMessage || 'An error occurred while loading customer list. Please try again.');
    });

    function loadDropdown($div, arr) {
        var options = '';
        $.each(arr, function (i, item) {
            options = options + '<option value="' + item.Value + '">' + item.Text + '</option>';
        });
        $div.html(options);
    }

введите описание изображения здесь

4b9b3361

Ответ 1

Вы пытались установить innerHTML внутри цикла,

 $div[0].innerHTML += '<option value="' + item.Value + '">' + item.Text + '</option>';

Вместо этого в конце.;

 $div.html(options);

Ответ 2

Возможно, вы захотите рассмотреть библиотеку сериализации, чтобы обрабатывать, сколько записей она действительно загружает сразу. Clusterize.js является очень хорошо сделанным и позволяет браузеру отображать в данный момент клиент. Он показывает где угодно до 100 000 + записей, которые будут обрабатываться таким образом.

https://clusterize.js.org/

Ответ 3

вы можете использовать:
Select2 вид утилиты loading 1000+ запись - не очень хорошая идея.
https://select2.github.io/examples.html

Ответ 4

Jquery может испытать удар производительности в старых браузерах. Вот решение, похожее на то, что вы испытываете. $.each() уже довольно медленный по сравнению с встроенным JS.