jquery - 使用 jQuery DataTables 在 FireFox 中出现样式错误

Question

我正在使用我目前拥有的表来实现数据表，但是在 Chrome 和 IE 中，它正确加载看起来像： 更大的图片：http: //i.imgur.com/Ms6lu.png

但是，当我使用 Firefox 时，它看起来像这样： 大图：http: //i.imgur.com/fZcO8.png

看起来插件没有在“显示 X 条目”之后创建新行。

表格设置为 Width="100%"。jquery如下：

$(document).ready(function () {
    var oTable = $('#table1').dataTable({
    "bStateSave": true,
    });
});

创建表如下：

<table id="table1" border="0" style="width:100%;">
    <thead>
        <tr>
            <td>ID</td><td>UserName</td><td>Sample Stuff</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>1234</td><td>user1</td><td>random stuff</td>
        </tr>
    </tbody>
    <tfoot>
        <tr>
            <td>
                <span>
                    <input type="text"  size="11" placeholder="Filter ID"/>
                </span>
            </td>
            <td>
                <span>
                    <input type="text"   size="10" Placeholder="Filter Username" />
                </span>
            </td>
            <td>
                <span>
                    <input type="text"  size="4"  Placeholder="Filter SampleStuff"/>
                </span>
            </td>
        </tr>
    </tfoot>
</table>

关于为什么会发生这种情况的任何想法？我已经研究过与 Datatables 相比的其他替代方案，但 datatables 看起来是最好用的。

Answer 1

试试这个“sDom”：'T<"clear">lfrtip'，其中 clear 将清除浮动

$(document).ready(function () {
    var oTable = $('#table1').dataTable({
    "sDom": 'T<"clear">lfrtip',
    "bStateSave": true,
    });
});