Javascript 数据表布局被scrollX弄乱了

我的站点上有4个表。一次仅显示1个。我有一个包装器，用于包装通过javascript隐藏和显示的表。当我在它们之间切换时，会完全弄乱布局。 这个问题出现在我将Scrollx设置为true之后，这是应用程序所必需的。它还可以在页眉和表体之间创建边距。 这是一个表代码：

            <div style="display:none;" id="longtimeTableWrapper" class="col-12 tableWrapper ">
            <table id="longtimeTable" class="table table-striped table-bordered reservationTable" cellspacing="0" width="100%">
                <thead>
                    <tr>
                        <th class="th-sm">
                            Kennzeichen
                        </th>
                        <th class="th-sm">
                            Name
                        </th>
                        <th class="th-sm">
                            Sichtausweis
                        </th>
                        <th class="th-sm">
                            Datum von
                        </th>
                        <th class="th-sm">
                            Datum bis
                        </th>
                        <th class="th-sm">
                            Grund
                        </th>
                        <th class="th-sm">
                            Bemerkung
                        </th>
                        <th class="th-sm">
                            2. Kennzeichen
                        </th>
                        <th class="th-sm">
                            Betrag
                        </th>
                        <th class="th-sm">
                            Adresse
                        </th>
                        <th class="th-sm">
                            Telefon
                        </th>
                        <th class="th-sm">
                            Areal
                        </th>
                        <th class="th-sm">
                            Erfasser
                        </th>

                    </tr>
                </thead>
                <tbody>
                    @{
                        foreach (var longtimeReservation in Model.ReservationsVM.LongtimeParkingReservations)
                        {
                            <tr>
                                <td>@longtimeReservation.CarMark</td>
                                <td>@longtimeReservation.GivenName @longtimeReservation.SurName</td>
                                <td>@longtimeReservation.BadgeNumber</td>
                                <td>@longtimeReservation.StartDate.ToShortDateString()</td>
                                <td>Grund</td>
                                <td>@longtimeReservation.Area.AreaName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>@longtimeReservation.CreatedByNavigation.UserName</td>
                                <td>
                                    <a id="PdfExport" class="m-1  "> <i class=" rgba-red-slight z-depth-1 red-text p-2 rounded fa-1x fas fa-file-pdf "></i></a>
                                    <a id="PdfExport" class="m-1   "> <i class=" rgba-red-slight z-depth-1 red-text p-2 rounded fa-1x fas fa-file-pdf "></i></a>
                                </td>
                            </tr>
                        }
                    }

                </tbody>

            </table>

        </div>

肯泽琴
名称
西希塔斯维斯
基准冯
基准之二
格伦德
比默尔贡
2.肯泽琴
贝特拉格
阿迪斯
电传
区域的
埃尔法瑟
@{
foreach（模型中的var longtimeReservation.ReservationsVM.LongtimeParkingReservations）
{
@卡马克酒店
@longtimeReservation.GivenName@longtimeReservation.name
@longtimeReservation.BadgeNumber
@longtimeReservation.StartDate.ToShortDateString（）文件
格伦德
@longtimeReservation.Area.AreaName
@longtimeReservation.CreatedByNavigation.UserName
@longtimeReservation.CreatedByNavigation.UserName
@longtimeReservation.CreatedByNavigation.UserName
@longtimeReservation.CreatedByNavigation.UserName
@longtimeReservation.CreatedByNavigation.UserName
@longtimeReservation.CreatedByNavigation.UserName

知道如何解决这个问题吗？
请使用选项共享您的Datatables init，或者更新此fiddle以重现您的问题并创建一个SO代码段，我为所有Datatables设置了默认值：$.extend（true，$.fn.dataTable.defaults，{“scrollX”：true，“searching”：true，“ordering”：true}）；以及：$（“#longtimeTable”）.DataTable（）；我看这里没有问题，或者我似乎无法复制。请您尝试复制一下好吗？或者我无能为力我想问题是我隐藏并显示了它们，因为这是导致问题的原因。我很确定。我不知道如何修复它，然后创建问题的完整工作片段！！：）我猜不到，也无法修复我看不见的东西