Question

Google Chrome的开发人员工具中出现以下错误：

未捕获的TypeError：无法读取未定义的属性“className”

抛出错误的代码是：

var oTable = $('#resultstable').dataTable({
                            "bAutoWidth" : true,
                            "iDisplayLength" : 10,
                            "bFilter" : false,
                            "bLengthChange" : false
                        });

resultstable是html中表的id：

<table cellpadding="0" cellspacing="0" border="0" id="resultstable"
                    name="resultstable" class="display datatable">

奇怪的是，在table标签之后有一个if语句。该表运行完美，当程序发送到else if{}部分时，CSS会正确显示，但它会抛出上述错误，并且当它位于if{}部分时不会应用CSS。 / p>

请帮忙！

Answer 1

另一个答案让我走上正轨。

更简洁，错误是我创建的表格不正确。

我的标题栏（当然在里面），与我的行列（在tbody中）不匹配

在我的情况下，我在标题中有太多列。

Answer 2

另一个可能的原因是，如果在“aoColumnDefs”属性中列出的列比表中的“td”元素多。

var yourTable = $('#product-search-results-table').dataTable({
    // If you only have three columns in the HTML table, then this line will cause an error, because it lists four columns in "aoColumnDefs".
    "aoColumnDefs": [{ "bSortable": false, "aTargets": [0, 1, 2, 3] }]
});

Answer 3

数据表要求你的html表是完美的。我发现当我没有等量的<th>和<td>时，我收到了此错误。确保没有额外的标题。

Answer 4

我得到了与你现在获得的错误相同的错误。我曾经使用Chosen库遇到过类似的错误。问题是（在Chosen的情况下）正在使用带有[]字符的ID，从而使css选择器和ID之间的Javascript混淆（请记住，在CSS中我们可以使用[]来指定属性）。

但是，对于DataTables，我注意到DataTables脚本本身在class = " "中的每个tr元素中的第一个元素之前添加tbody。

原因是因为php的HTML输出存在逻辑错误。错误代码：

<?php
for ($currentRow = 0 ; $currentRow <= $query_length; $currentRow++) {
        ?>
        <tr>
        <?php
        list($job_id, $company_id, $job_title, $industry_id, $profession_int, $job_openings, $job_city, $job_salary_start, $job_end_date, $job_start_date, $job_skills, $company_name, $isConfidential, $job_experience_level) = dbRow($query_results, $currentRow);
      echo "<td class = \"detailed-job-row\">" . $job_title . "</td>";
      echo "<td class = \"detailed-job-row\">" . $company_name . "</td>";
      echo "<td class = \"detailed-job-row\">" . $industry_id . "</td>";
      echo "<td class = \"detailed-job-row\">" . $profession_int . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_openings . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_city . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_salary_start . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_end_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_start_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_skills . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_experience_level . "</td>";
      ?>
        </tr>
        <?php  
     } ?>
    </tbody>
  </table>
<?php
}
?>

在长长桌的底部有一个错误，表明postgres无法跳到第208行。这告诉我，我需要停止在i - 1或$currentRow - 1处循环。< / p>

因此，固定的，有效的代码：

<?php
for ($currentRow = 0 ; $currentRow <= $query_length - 1; $currentRow++) {
        ?>
        <tr>
        <?php
        list($job_id, $company_id, $job_title, $industry_id, $profession_int, $job_openings, $job_city, $job_salary_start, $job_end_date, $job_start_date, $job_skills, $company_name, $isConfidential, $job_experience_level) = dbRow($query_results, $currentRow);
      echo "<td class = \"detailed-job-row\">" . $job_title . "</td>";
      echo "<td class = \"detailed-job-row\">" . $company_name . "</td>";
      echo "<td class = \"detailed-job-row\">" . $industry_id . "</td>";
      echo "<td class = \"detailed-job-row\">" . $profession_int . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_openings . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_city . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_salary_start . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_end_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_start_date . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_skills . "</td>";
      echo "<td class = \"detailed-job-row\">" . $job_experience_level . "</td>";
      ?>
        </tr>
        <?php  
     } ?>
    </tbody>
  </table>
<?php
}
?>

执行此更改可使DataTables正常运行。

因此，虽然我无法提供可行的解决方案，但我建议您查看您的html标记，因为这可能是您问题的根源（例如，您的表格是否有tbody？）。

Answer 5

在我的特定情况下，我设置了aTargets属性，其数组索引超出了我的元素的范围。

$('.datatable').dataTable({
  aoColumnDefs: [
    {
      bSortable: false,
      aTargets: [0, 6]
    }
  ],
  aaSorting: []
});

这个设置有7个td列，但只有6个。将它更改为以下更正它：

$('.datatable').dataTable({
  aoColumnDefs: [
    {
      bSortable: false,
      aTargets: [0, 5]
    }
  ],
  aaSorting: []
});

Answer 6

它抛出了这个错误，因为dom首次加载时你在声明之前使用了。

对于这个错误我有一个写在下面的解决方案：

你可以添加if条件特定元素未定义如下

if(document.getElementsByTagName('button') !== undefined){
  // and write your needed code here
}

Answer 7

遇到类似的问题。根本情况是，虽然dataTable即将控制表，但我们的代码也试图同时操纵表的属性。错误消息没有这么说，但是，一旦表格只由dataTable管理，问题就消失了。

未捕获的TypeError：无法读取未定义的属性“className”

7 个答案: