表格与jqm显示不正确

Question

我正在尝试向页面添加一个jquery移动表，它应该是直接的，但我无法正确显示它。下面的代码在完整的浏览器中工作正常，它与我总是制作html表的方式相同。

    `<div role="main" class="ui-content">
        <table data-role="table" data-mode="reflow" name="hotOrderTable" id="hotOrderTable" class="ui-responsive table-stroke">
            <thead>
                <tr>
                    <td>!</td><td>Parts</td><td>Customer</td>
                </tr>
            </thead>
            <tbody>
                <tr><td>foo1</td><td>foo2</td><td>foo3</td></tr>
                <tr><td>foo4</td><td>foo5</td><td>foo6</td></tr>
            </tbody>
        </table><!-- /table -->
    </div><!-- /main -->`

在我的移动浏览器上，行不会像他们应该的那样在彼此之上显示。相反，表格会在一列中显示所有<th>元素，并在第二列中添加<td>。如果我添加更多行，它会显示一个列，其中标题再次堆叠，信息显示在右侧：

！ foo1
零件foo2
客户foo3
！ foo4
零件foo5
客户foo6

等等

我不知道我错过了什么/忽视