Question

当我使用jQuery数据表时，我收到以下错误。

错误：无法获取属性＆＃39; mData＆＃39;未定义或空引用

代码

<link rel="stylesheet" type="text/css" href="css/jquery.dataTables.css">

<script type="text/javascript" src="js/jquery-2.1.4.js"></script>
<script type="text/javascript" src="js/jquery.dataTables.js"></script>

<script type="text/javascript">

    $(document).ready(function() {
           $('#empTable').DataTable();
    } );
</script>

<table id="empTable" class="display" width="100%">
    <tr>
        <th>Name</th>
        <th>Age</th>
        <th>Address</th>
    </tr>
    <tr>
        <td>AAAAA</td>
        <td>32</td>
        <td>Colombo</td>
    </tr>
    <tr>
        <td>BBBBB</td>
        <td>29</td>
        <td>Kandy</td>
    </tr>
</table>

请建议我如何解决此问题？

Answer 1

您的html结构不正确，您需要有一个thead元素，其中指定了标题，内容应该在tbody。

$(document).ready(function() {
  $('#empTable').DataTable();
});

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/css/jquery.dataTables.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/js/jquery.dataTables.js"></script>

<table id="empTable" class="display" width="100%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Address</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>K.Senthuran</td>
      <td>32</td>
      <td>42nd Lane</td>
    </tr>
    <tr>
      <td>S.Senthuran</td>
      <td>29</td>
      <td>Hampden Lane</td>
    </tr>
  </tbody>
</table>

Answer 2

$(document).ready(function() {
  $('#empTable').DataTable();
});

<script type="text/javascript" src="//code.jquery.com/jquery-2.1.3.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/css/jquery.dataTables.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/datatables/1.10.7/js/jquery.dataTables.js"></script>

<table id="empTable" class="display" width="100%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Age</th>
      <th>Address</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>K.Senthuran</td>
      <td>32</td>
      <td>42nd Lane</td>
    </tr>
    <tr>
      <td>S.Senthuran</td>
      <td>29</td>
      <td>Hampden Lane</td>
    </tr>
  </tbody>
</table>

Answer 3

另一个需要匹配的HTML结构是<th>中的<thead>标签和<tr>中的<tbody>。也就是说，如果您在表中希望有5列，则应该有5个<th>标签和5个<tr>标签。

得到此错误 - 无法获取属性＆＃39; mData＆＃39;未定义或空引用的

3 个答案: