javascript - 无法读取未定义的属性 'oScroll' - jQuery DataTables

Question

我正在使用数据表对从服务器加载的结果进行分页。

当我导入 jquery.dataTables.js 和 jquery.dataTables.css (1.10.2) 时，浏览器控制台显示此错误:无法读取未定义的属性“oScroll”。问题出在这一行:

 var scroll = settings.oScroll;

它涉及重新计算数据表列大小的函数:

/**
 * This function will make DataTables recalculate the column sizes, based on the data
 * contained in the table and the sizes applied to the columns (in the DOM, CSS or
 * through the sWidth parameter). This can be useful when the width of the table's
 * parent element changes (for example a window resize).
 *  @param {boolean} [bRedraw=true] Redraw the table or not, you will typically want to
 *  @dtopt API
 *  @deprecated Since v1.10
 *
 *  @example
 *    $(document).ready(function() {
 *      var oTable = $('#example').dataTable( {
 *        "sScrollY": "200px",
 *        "bPaginate": false
 *      } );
 *
 *      $(window).bind('resize', function () {
 *        oTable.fnAdjustColumnSizing();
 *      } );
 *    } );
 */
this.fnAdjustColumnSizing = function ( bRedraw )
{
    var api = this.api( true ).columns.adjust();
    var settings = api.settings()[0];
    var scroll = settings.oScroll;

    if ( bRedraw === undefined || bRedraw ) {
        api.draw( false );
    }
    else if ( scroll.sX !== "" || scroll.sY !== "" ) {
        /* If not redrawing, but scrolling, we want to apply the new column sizes anyway */
        _fnScrollDraw( settings );
    }
};

有人对这个问题有想法吗？

提前致谢..

Answer 1

这是另一个 dataTable() 与 DataTable() 的问题。如您所见，fnAdjustColumnSizing 已弃用。更糟糕的是，它根本不适用于 DataTable() 构造函数。解决方案，要么使用旧的 dataTable 构造函数实例化您的表:

var table = $('#example').dataTable({

或者，使用 1.10.x API 方法:

var table = $('#example').DataTable({
   "sScrollY": "200px",
   "bPaginate": false
});

$(window).bind('resize', function () {
   table.columns.adjust().draw(); 
});

演示，您可以在其中试验两者 -> http://jsfiddle.net/w6vhusay/