Javascript 一页两个数据表-秒一初始化

我的页面中有两个

dataTable

，我有如下方法：

function ToDataTable()
{
    $(".dataTable").css("width", "100%");

    $(".dataTable").each(function ()
    {
        var $that = $(this);

        /* Start of method */
        function ToDataTableInternal()
        {
           var table = $that.DataTable({
               responsive: {
                   details: { type: "column", target: -1 },
               },
               columnDefs: [{
                       className: "control", orderable: !1, targets: -1,
                   },
                   { orderable: !1 }],
               "paging": false,
               "ordering": false,
               "info": false,
               "searching": false,
                retrieve: true
           });
        }
        /* End of method */

        if ($that.is(":visible"))
        {
            ToDataTableInternal()
        }
        else
        {
            // Observe all invisible parents or table to trigger
            // ToDataTableInternal method if made visible
            var $arr = $(this).parentsUntil(":visible").filter(function ()
            {
                return $(this).css("display") === "none";
            }).add($(this));

            var observers = [];

            $arr.each(function ()
            {
                var observer = new MutationObserver(function (mutations)
                {
                    mutations.forEach(function (mutation)
                    {
                        if ((mutation.attributeName === 'style' ||
                               mutation.attributeName === 'class') && 
                                 $that.is(":visible"))
                        {
                            ToDataTableInternal();

                            for (var i = 0; i < observers.length; i++)
                            {
                                // Disconnect observers
                                observers[i].disconnect();
                            }
                        }
                    });
                });

                observers.push(observer);
                observer.observe(this, {
                    attributes: true
                });
            });
        }
    });
}

函数ToDataTable（）
{
$（“.dataTable”）.css（“宽度”、“100%”）；
$（“.dataTable”）。每个（函数（）
{
var$that=$（this）；
/*方法的开始*/
函数ToDataTableInternal（）
{
var table=$that.DataTable({
响应：{
详细信息：{类型：“列”，目标：-1}，
},
columnDefs：[{
类名：“控制”，可订购：！1，目标：-1，
},
{可排序：！1}]，
“分页”：false，
“命令”：错误，
“信息”：错误，
“搜索”：错误，
检索：true
});
}
/*方法结束*/
如果（$that.is（“：visible”））
{
ToDataTableInternal（）
}
其他的
{
//观察要触发的所有不可见父级或表
//ToDataTableInternal方法（如果使其可见）
var$arr=$（this）.parentsUntil（“：可见”）.filter（函数（）
{
返回$（this.css（“display”）=“none”；
})。加入（$（本））；
var观察员=[]；
$arr.each（函数（）
{
var观察者=新的突变观察者（功能（突变）
{
突变。forEach（功能（突变）
{
如果（（mutation.attributeName==='style'||
mutation.attributeName==='class'）&&
$that.is（“：可见”））
{
ToDataTableInternal（）；
对于（变量i=0；i<0.length；i++）
{
//断开观察员的连接
观察员[i].disconnect（）；
}
}
});
});
观察员。推（观察员）；
观察者，观察（这个{
属性：true
});
});
}
});
}

我使用这种方法的原因是，当表的显示为

none

时，它确实滞后于浏览器（尤其是在浏览器中，我至少5秒钟内无法执行任何操作），这就是我在表可见后将其更改为DataTable的原因

但是单独调用方法的问题是，第二个DataTable没有我传递的相同设置（第一个有），而第二个DataTable中也有过滤器、分页和排序元素

如果我同时给两个人打电话，没有什么不寻常的事情发生。有什么问题吗

---

编辑：我无法在小提琴中再现相同的行为。

您可以在dataTable配置中添加dataTable的以下属性，以删除筛选、分页和排序：

数据表1.9

• “bPaginate”：false，//启用或禁用分页
• “bFilter”：false，//启用或禁用数据筛选
• “bLengthChange”：false，//启用或禁用大小下拉列表
• “bSort”：false，//启用或禁用列排序
• “bInfo”：false，//启用或禁用表格信息显示

更新

数据表1.10 datatable 1.10中的选项名称更新

• b分页->分页
• B过滤器->搜索
• 混合更改->长度更改
• b分拣->订购
• bInfo->info

---

当我尝试做同样的事情时，在其他环境中似乎没有问题

---

我们使用的另一个库导致了问题，DataTable库没有问题。

，DataTable 1.10更改了配置名称。正如您在我的问题中已经看到的，我添加了这些参数，我的问题与此不同。