javascript - jQuery Datatables在IE9上缓慢渲染

我在将大量数据加载到数据表（jquery）时遇到问题。
尽管Chrome / Firefox的加载时间是可以接受的（大约2秒），但是我的应用程序需要在IE9中运行，加载时间约为16秒。
我尝试使用“ bDeferRender”：true，但没有成功。
该数据表在底部有选择过滤器，每当用户在列中选择一个值时，都需要更新所有其他过滤器。同样，所有行在第一列中都有一个复选框，可让用户选择一行。

数据表初始化：

        var tableApi;
        var initFunction = function(){
            tableApi = this.api();
            setTimeout(function(){
                preventFirstDraw = false;
            },5000);
            tableApi.columns().indexes().flatten().each( function ( colIdx ) {
                if(colIdx>0){
                    var column = tableApi.column( colIdx );
                    if(colIdx-1')
                            .appendTo( $(column.footer()).empty() )
                            .on( 'change', function () {
                                var val =  $(this).val();
                                var columnInside = tableApi.column( colIdx );
                                columnInside
                                    .search( val ? '^'+val+'$' : '', true, false )
                                    .draw();
                                bindTableClick(id,index);
                                var nextColIdx = colIdx+1;
                                $("select[data-colIdx='"+nextColIdx+"']").each(function(){
                                    var select = $(this);
                                    select.empty();
                                    tableApi.rows().data().each( function ( d, j ) {
                                        if(d[colIdx].toLowerCase() == val.toLowerCase() || $.trim(val)==""){
                                            select.append( ''+d[nextColIdx]+'' );
                                        }
                                    } );

                                });
                            } );
                        column.data().unique().sort().each( function ( d, j ) {
                           select.append( ''+d+'' )
                    });
                    }else{
                        $( 'input', column.footer() ).on( 'keyup change', function () {
                            oTable
                                .column( colIdx )
                                .search( this.value )
                                .draw();
                            bindTableClick(id,index);
                        } );
                    }
                }
            } );
        };
        var oTable = table.DataTable({
            "language": dataTableFR,
            "aaSorting": [[0, 'asc']],
            "iDisplayLength": 10,
            "bDeferRender" : true,
            "initComplete": initFunction
        });

bindTableClick功能：

        function bindTableClick(id,index){
                Metronic.init();
                $('#'+id+" tbody tr").unbind('click');
                $("#"+id+" tbody tr").click( function(){
                    if($(this).hasClass("active")){
                        $(this).removeClass("active");
                        $(this).find('.checkboxes').each(function(){
                            $(this).attr('selected', false);
                            $(this).parent().removeClass('checked');
                            $(this).trigger('change');
                        });
                        var headers = $(this).parents('table').find('th').map(function() {
                            return $.trim($(this).attr('data-alias'));
                        }).get();
                        var values = $(this).find('td').map(function() {
                            return "";
                        }).get();
                        updateComponentTableValue(headers,values);
                    }else{
                        $("#"+id+" tbody tr").removeClass("active");
                        $("#"+id+" tbody tr .checkboxes").each(function(){
                            $(this).attr('selected', false);
                            $(this).parent().removeClass('checked');
                            $(this).trigger('change');
                        });
                        $(this).addClass("active");
                        $(this).find('.checkboxes').each(function(){
                            $(this).parent().addClass('checked');
                            $(this).attr('selected', true);
                            $(this).trigger('change');
                        });
                        var headers = $(this).parents('table').find('th').map(function() {
                            return $.trim($(this).attr('data-alias'));
                        }).get();
                        var values = $(this).find('td').map(function() {
                            return $.trim($(this).text());
                        }).get();
                        updateComponentTableValue(headers,values);
                        triggerComponent(index,"");
                    }
                });
                $('#'+id+' .group-checkable').change(function () {

                    var set = jQuery(this).attr("data-set");
                    var checked = jQuery(this).is(":checked");
                    jQuery(set).each(function () {
                        if (checked) {
                            $(this).attr("checked", true);
                            $(this).parents('tr').addClass("active");
                        } else {
                            $(this).attr("checked", false);
                            $(this).parents('tr').removeClass("active");
                        }
                    });
                    jQuery.uniform.update(set);
                });
        }

最佳答案

这是我的数据表配置：

   var dataTable = $('#users').dataTable(
            {
            "sAjaxSource": "users/complete_list", /* Contains one thousand of users which are charged in few seconds */
            "deferRender": true,
            "bProcessing": true,
            "bServerSide": true,
        }

    );

尝试一下，告诉我是否适合您。 ^^

关于javascript - jQuery Datatables在IE9上缓慢渲染，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27314374/