Jquery DataTables未在引导断点处调整大小

我有一个问题，我相信我已经把它缩小到DataTables响应插件。

在Bootstrap中，我有两列，共六列。左边是数据表，右边是div框。当浏览器缩小范围时，这两个项目应拆分为各自的行，并相互堆叠，项目居中。但是，在该断点处，DataTable不会调整大小以在屏幕上居中显示。它停在左边。如果以该宽度刷新页面，页面将自动居中，但不会响应断点。
如果你反其道而行之，以手机大小开始页面，并将窗口向外展开，DataTable将保持在左侧的一个细列中

如果我取出响应插件，它会在断点处将自己很好地居中。然而，我想使用这个插件来帮助处理电话大小的表格

下面是这一行的示例

<div class="row">
    <div class="col-md-6">
        <table id="table1" class="table">
            <thead>
                <tr>
                    <th>data</th>
                    <th>data</th>
                    <th>data</th>
                    <th>data</th>
                 </tr>
            </thead>
            <tbody>
                <tr>
                    <td>data</td>
                    <td>data</td>
                    <td>data</td>
                    <td>data</td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="col-md-6">
        <div class="box">

        </div>
    </div>
</div><!--End Row-->

数据
数据
数据
数据
数据
数据
数据
数据

这是我正在使用的css

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>    

<link href="//cdn.datatables.net/1.10.8/css/dataTables.dataTables.min.css" rel="stylesheet"/> 

<link href="//cdn.datatables.net/responsive/1.0.7/css/responsive.dataTables.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<script src="//cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>

<script src="//cdn.datatables.net/responsive/1.0.7/js/dataTables.responsive.min.js"></script>

这是我正在使用的js

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>    

<link href="//cdn.datatables.net/1.10.8/css/dataTables.dataTables.min.css" rel="stylesheet"/> 

<link href="//cdn.datatables.net/responsive/1.0.7/css/responsive.dataTables.min.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>"></script>

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

<script src="//cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>

<script src="//cdn.datatables.net/responsive/1.0.7/js/dataTables.responsive.min.js"></script>

“>

下面是一个使用DataTables依赖项进行引导的示例

启动数据表时，您是否使用了

responsive

选项（

responsive:true

见下文）

$（'#表1'）。数据表({
回答：对
})；

.box{
高度：100px；
宽度：100%；
背景：浅蓝色；
填充：20px；
颜色：白色；
}

数据
数据
数据
数据
数据
数据
数据
数据
盒子

我也有同样的问题，这是我的解决方法：

$(window).resize(function () {
            $("table.dataTable").resize();
});

---

我最近遇到了这样的问题。我认为您没有正确使用引导。请将您的div更改为以下内容

<div class="col-xs-12 col-md-6">

---

xs、sm、md、lg是从最小到最大的屏幕尺寸。当您应用col-md-6时，它将为md及以上尺寸应用6个空格的宽度。您还需要指定它应占据xs及以上尺寸屏幕的全宽。

是的，我正在正确初始化它。我在一个应用程序中有使用此响应插件的经验我正在使用的其他应用程序。这是我第一次将其与Bootstrap混合使用。我将尝试您发布的内容，并让您知道我是否看到了差异。我尝试了代码，但我认为您自己没有使用DataTables Responsive。您没有链接此处找到的任何响应css或js文件。您的版本中的表它的响应仅仅是因为Bootstrap，但它根本没有使用DataTables插件。