Javascript 使用jquery数据表，我可以'；t在不损坏固定头的情况下，使单元colspan=3

我有一个fixedhead数据表，向下滚动时，前4行固定在顶部，问题是，当我试图使第二行colspan=3表示“make me colspan=3”时，数据表失去了固定在顶部的能力。我不知道为什么这会影响数据表。谢谢你的帮助。 代码：

从文件中：

请注意，每个列必须至少有一个唯一的单元格（即没有colspan的单元格），以便DataTables可以使用该单元格检测列并使用它应用排序

在您的示例中，您试图应用

colspan

的标题

列

不包含“唯一单元格”

但是，您可以通过添加一个不带

colspan

的头行，然后将其css设置为

display:none：


标题示例：

 <thead>
        <tr>
            <th colspan=3></th>
            <th colspan=3>234</th>
        </tr>
        <!-- ADDED: Placeholder row for sorting -->
        <tr class="place">
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
        </tr>
        <!-- END Placeholder row for sorting -->
        <tr>
            <th colspan="3">Make me colspan = 3</th>
            <th>
                <p class="rotatehead">Hazmat</p>
            </th>
            <th>
                <p class="rotatehead">Out of Area</p>
            </th>
            <th>
                <p class="rotatehead">Lite</p>
            </th>
        </tr>
        <tr>
            <th colspan=3>RACK</th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
        </tr>
        <tr>
            <th colspan=3>TOTAL</th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>345</div>
            </th>
        </tr>
    </thead>

.place{
    display: none;
}

太棒了！答案和解决方法。谢谢老兄，我很感激！谢谢很高兴能帮忙。
 <thead>
        <tr>
            <th colspan=3></th>
            <th colspan=3>234</th>
        </tr>
        <!-- ADDED: Placeholder row for sorting -->
        <tr class="place">
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
            <th></th>
        </tr>
        <!-- END Placeholder row for sorting -->
        <tr>
            <th colspan="3">Make me colspan = 3</th>
            <th>
                <p class="rotatehead">Hazmat</p>
            </th>
            <th>
                <p class="rotatehead">Out of Area</p>
            </th>
            <th>
                <p class="rotatehead">Lite</p>
            </th>
        </tr>
        <tr>
            <th colspan=3>RACK</th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
        </tr>
        <tr>
            <th colspan=3>TOTAL</th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>234</div>
            </th>
            <th>
                <div contenteditable>345</div>
            </th>
        </tr>
    </thead>

.place{
    display: none;
}