jquery - jquery mobile，表总是重排

Question

我遇到了 jquery-mobile 表的问题（使用 data-role="table"）。我的桌子总是重排（即使是全高清屏幕），这里是 演示页面的链接。

我已经尝试过使用 jquery-mobile 1.3 和 1.4b，但结果仍然相同。

Doctype 声明且有效的 html5（编码除外）...

Answer 1

这是因为默认情况下（= 不指定模式），表将处于reflow模式。

要切换到 columnToggle 模式，只需添加data-mode="columntoggle"到您的表格标签，如文档中所述

Answer 2

您必须添加 class="ui-responsive" ，它将按照 1.4 文档中的建议工作，如果您想让整个表不进行回流，那么只需添加以下内容：

@media ( max-width: 35em ) {
    .ui-table-reflow.ui-responsive td,
    .ui-table-reflow.ui-responsive th {
        width: auto;
        float: none;
        clear: none;
        display: table-cell;
        margin: 0;
        padding:0;
    }

}

上面的代码覆盖了相同宽度的 jquery 移动结构并阻止它重排。