有关更新的问题

Question

我正在尝试使用数据表，但始终收到mdata错误。

未捕获的TypeError：无法读取未定义的属性'mData'

jQuery.Deferred异常：无法读取未定义类型的属性'mData'错误：无法读取未定义属性'mData'

这是我的html和jq。我有相同数量的ths和tds。我想念什么？

    <script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.js"></script>
    <script>
    $(document).ready(function(){
		$('#seats').DataTable( {
        		"order": [[ 1, "desc" ]]
    		} );
    </script>

   <html>
    <head>
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.css"/>
    <body>

    <div class="container">
    <table class="table table-hover" id="seats">
			<thread>
				<tr>
					<th>Seat Number</th>
					<th>Full Name</th>
					<th>Status and Level</th>
				</tr>
			</thread>
                        <tbody>
                           <tr><td class='one'>1</td><td class='two'>NAME1</td><td class='three'>...</td></tr>
                           <tr><td class='one'>106</td><td class='two'>NAME2</td><td class='three'>...</td></tr>
                           <tr><td class='one'>107</td><td class='two'>NAME3</td><td class='three'>...</td></tr>
                           <tr><td class='one'>113</td><td class='two'>NAME4</td><td class='three'>...</td></tr>
    </tbody></table></div>
    </body></html>

Answer 1

您正在按索引为3的列排序，即4th列

由于您没有4th列，因此数据表给您以下错误。

jQuery.Deferred exception: Cannot read property 'aDataSort' of undefined TypeError: Cannot read property 'aDataSort' of undefined

$(document).ready(function(){
    $('#seats').DataTable( {
            "order": [[ 2, "desc" ]]
        } );
        });

<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.css"/>
<body>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.js"></script>
<div class="container">
<table class="table table-hover" id="seats">
        <thead>
            <tr>
                <th>Seat Number</th>
                <th>Full Name</th>
                <th>Status and Level</th>
            </tr>
        </thead>
        <tbody>
                       <tr><td class='one'>1</td><td class='two'>NAME1</td><td class='three'>...</td></tr>
                       <tr><td class='one'>106</td><td class='two'>NAME2</td><td class='three'>...</td></tr>
                       <tr><td class='one'>107</td><td class='two'>NAME3</td><td class='three'>...</td></tr>
                       <tr><td class='one'>113</td><td class='two'>NAME4</td><td class='three'>...</td></tr>
</tbody></table></div>
</body>
</html>

有关更新的问题

您没有正确关闭$(document).ready函数
您使用的是thread而不是thead

进行这些更改，代码将开始工作。

$(document).ready(function() {
  $('#seats').DataTable({
    "order": [
      [1, "desc"]
    ]
  });
});

<html>

<head>
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.css" />
  <script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.js"></script>

  <body>

    <div class="container">
      <table class="table table-hover" id="seats">
        <thead>
          <tr>
            <th>Seat Number</th>
            <th>Full Name</th>
            <th>Status and Level</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td class='one'>1</td>
            <td class='two'>NAME1</td>
            <td class='three'>...</td>
          </tr>
          <tr>
            <td class='one'>106</td>
            <td class='two'>NAME2</td>
            <td class='three'>...</td>
          </tr>
          <tr>
            <td class='one'>107</td>
            <td class='two'>NAME3</td>
            <td class='three'>...</td>
          </tr>
          <tr>
            <td class='one'>113</td>
            <td class='two'>NAME4</td>
            <td class='three'>...</td>
          </tr>
        </tbody>
      </table>
    </div>
  </body>

</html>

Answer 2

您没有关闭脚本标签。同样不要忘记，如果我没有记错的话，数据表需要同时具有thead和tbody。干得好。如果您接受，请标记答案。

<head>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.css"/>
<body>
<script type="text/javascript" src="https://cdn.datatables.net/v/dt/jq-3.3.1/dt-1.10.18/datatables.min.js"></script>
<script>
$(document).ready(function(){
    $('#seats').DataTable( {
            "order": [[ 3, "desc" ]]
        });
});
        </script>
<div class="container">
<table class="table table-hover" id="seats">
        <thead>
            <tr>
                <th>Seat Number</th>
                <th>Full Name</th>
                <th>Status and Level</th>
            </tr>
        </thead>
                    <tbody>
                       <tr><td class='one'>1</td><td class='two'>NAME1</td><td class='three'>...</td></tr>
                       <tr><td class='one'>106</td><td class='two'>NAME2</td><td class='three'>...</td></tr>
                       <tr><td class='one'>107</td><td class='two'>NAME3</td><td class='three'>...</td></tr>
                       <tr><td class='one'>113</td><td class='two'>NAME4</td><td class='three'>...</td></tr>
</tbody></table></div>
</body></html>

尝试使用数据表时出现mData错误

2 个答案:

有关更新的问题