多个数据表：一个表的 ajax 请求会阻塞另一表上的事件

Question

我正在使用 jQuery DataTable 插件。一页上有两个数据表（在引导选项卡中），均通过 ajax 加载。当一个表完成加载时，我希望用户能够对其进行排序/更改页面/搜索，即使另一个表仍在从服务器获取数据。但是，当任一表进行 ajax 调用时，这两个表都会被阻止注册任何排序/分页/搜索事件。

为了检查 ajax 调用期间是否注册了点击，我设置了一个常规点击处理程序，它显示列标题实际上正在被点击。但是，如果没有运行数据表 ajax 调用，则该单击只会生成数据表顺序事件。

$(function () {
    // code here
    // columns setup...

    createDatatable(videoColumns, $("#VideoTab"), "Videos");
    createDatatable(booksColumns, $("#BooksTab"), "Books");
});

function createDatatable(columns, $tableContainer, tableType) {        
    var $dataTable = $tableContainer.find(".custom-data-table");    

    var mTable = $dataTable.DataTable({
        serverSide: true,
        ajax: {
            url: "/Tables/GetTableData",
            data: function (d) {
                return $.extend({}, d, {
                    tableType: tableType
                });
            },
            type: "POST"
        },
        columns: columns
    });

    //isn't called when either table is still loading data
    $dataTable.on('order.dt', function () {
        console.log("table ordered " + tableType);
    });

    //this registers a click on the column header even when ajax is running
    $tableContainer.on("click", function(e){
        console.log(e.target);
    });
}

有一个可能相关的数据表内部设置，但我不知道如何更改以阻止它阻止当前未进行 ajax 调用的表上的注册事件。

    /**
     * Note if draw should be blocked while getting data
     *  @type boolean
     *  @default true
     */
    "bAjaxDataGet": true,