相关疑难解决方法(0)

DataTables隐藏行详细信息示例 - 表头放错位置(连接测试用例)

我正在尝试创建一个表,在单击加号图像时可以看到更多细节 - 类似于DataTables隐藏行详细信息示例

不幸的是,有一个警告被打印为JavaScript警报,并且表头也被错放了 - 就好像其中有太多或不足的表格单元格:

在此输入图像描述

我准备了一个简单的测试用例,当你将它保存到文件并在浏览器中打开时,它会立即生效:

<!DOCTYPE HTML>
<html>
<head>
    <link type="text/css" rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/jquery-ui.css">
    <link type="text/css" rel="stylesheet" href="https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/css/jquery.dataTables_themeroller.css">
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
    <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.min.js"></script>
    <script type="text/javascript">

        var data = [
            {"Total":17,"A":0,"B":0,"Details":{"BSN":"1147387861","ProjectName":"R127","StationName":"D"},"C":0,"D":17,"Test":"GSM_1900_GMSK_TXPOWER_HP_H","Measurement":"MEASUREMENT"},
            {"Total":8,"A":0,"B":0,"Details":{"BSN":"1147387861","ProjectName":"R127","StationName":"D"},"C":0,"D":8,"Test":"TX_PWR_64_54","Measurement":"POWER"}
        ];

        $(function() {

            function fnFormatDetails(oTable, nTr) {
                var aData = oTable.fnGetData(nTr);
                var sOut = '<table bgcolor="yellow" cellpadding="8" border="0" style="padding-left:50px;">';
                sOut += '<tr><td>BSN:</td><td>' + aData['Details']['BSN'] + '</td></tr>';
                sOut += '<tr><td>Station:</td><td>' + aData['Details']['StationName'] + '</td></tr>';
                sOut += '<tr><td>Project:</td><td>' + aData['Details']['ProjectName'] + '</td></tr>';
                sOut += '</table>'; …
Run Code Online (Sandbox Code Playgroud)

html css html-table datatables

7
推荐指数
1
解决办法
2万
查看次数

标签 统计

css ×1

datatables ×1

html ×1

html-table ×1