javascript - 一页中有两个数据表 - 第二个数据表初始化很奇怪

Question

我的页面中有两个 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
                });
            });
        }
    });
}

我使用这种方法的原因是，当表格的显示为none时，它确实滞后于浏览器(尤其是IE，我在至少5秒内无法执行任何操作)，这就是我的原因在表格可见后将其更改为 DataTable。

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

如果我同时调用两者，则不会发生任何异常情况。可能是什么问题？

编辑:我无法在 fiddle 中重现相同的行为。

Answer 1

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

我们使用的另一个库引起了问题，而 DataTable 库没有问题。