jQuery DataTable不是一个函数

时间:2017-06-06 14:50:47

标签: javascript jquery datatable

我已经做了很多搜索,每个人都说这是因为在jQuery之前包含DataTable脚本,或者是双重包含jQuery。

但是,我的代码并非如此。

我一直认为$(...).DataTable不是一个功能。

<!DOCTYPE html>   
<html lang="en">   
<head>   
  <meta charset="utf-8">   
  <title>Example of Employee Table with twitter bootstrap</title>   
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>


    <script type="text/javascript">
        $(document).ready(function(){
            $('#myTable').DataTable();
        });
    </script>
</head>  
<body style="margin:20px auto">  
    <table id="myTable" class="table table-striped" >  
        <thead>  
          <tr>  
            <th>ENO</th>  
            <th>EMPName</th>  
            <th>Country</th>  
            <th>Salary</th>  
          </tr>  
        </thead>  
        <tbody>  
          <tr>  
            <td>001</td>  
            <td>Anusha</td>  
            <td>India</td>  
            <td>10000</td>  
          </tr>  
          <tr>  
        <td>002</td>  
        <td>Charles</td>  
        <td>United Kingdom</td>  
        <td>28000</td>  
      </tr>  
      <tr>  
        <td>003</td>  
        <td>Sravani</td>  
        <td>Australia</td>  
        <td>7000</td>  
      </tr>  
       <tr>  
        <td>004</td>  
        <td>Amar</td>  
        <td>India</td>  
        <td>18000</td>  
      </tr>  
      <tr>  
        <td>005</td>  
        <td>Lakshmi</td>  
        <td>India</td>  
        <td>12000</td>  
      </tr>  
      <tr>  
        <td>006</td>  
        <td>James</td>  
        <td>Canada</td>  
        <td>50000</td>  
      </tr>  

       <tr>  
        <td>007</td>  
        <td>Ronald</td>  
        <td>US</td>  
        <td>75000</td>  
      </tr>  
      <tr>  
        <td>008</td>  
        <td>Mike</td>  
        <td>Belgium</td>  
        <td>100000</td>  
      </tr>  
    </tbody>  
  </table>  
  </div>
</body>  

</html>  

3 个答案:

答案 0 :(得分:1)

https是安全连接。在您的情况下,您在http中使用的http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js可能是问题的根源

&#13;
&#13;
$(document).ready(function() {
  $('#myTable').DataTable();
});
&#13;
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>



<body style="margin:20px auto">
  <table id="myTable" class="table table-striped">
    <thead>
      <tr>
        <th>ENO</th>
        <th>EMPName</th>
        <th>Country</th>
        <th>Salary</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>001</td>
        <td>Anusha</td>
        <td>India</td>
        <td>10000</td>
      </tr>
      <tr>
        <td>002</td>
        <td>Charles</td>
        <td>United Kingdom</td>
        <td>28000</td>
      </tr>
      <tr>
        <td>003</td>
        <td>Sravani</td>
        <td>Australia</td>
        <td>7000</td>
      </tr>
      <tr>
        <td>004</td>
        <td>Amar</td>
        <td>India</td>
        <td>18000</td>
      </tr>
      <tr>
        <td>005</td>
        <td>Lakshmi</td>
        <td>India</td>
        <td>12000</td>
      </tr>
      <tr>
        <td>006</td>
        <td>James</td>
        <td>Canada</td>
        <td>50000</td>
      </tr>

      <tr>
        <td>007</td>
        <td>Ronald</td>
        <td>US</td>
        <td>75000</td>
      </tr>
      <tr>
        <td>008</td>
        <td>Mike</td>
        <td>Belgium</td>
        <td>100000</td>
      </tr>
    </tbody>
  </table>
  </div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

@Philip Tenn,我已经使用和不使用https检查了代码。但我对你的代码没有任何问题,它的工作正常。

答案 2 :(得分:1)

你桌子末尾有一个</div>不应该在那里,但你的代码工作正常......

$(document).ready(function(){
  $('#myTable').DataTable();
});
<!DOCTYPE html>   
<html lang="en">   
<head>   
  <meta charset="utf-8">   
  <title>Example of Employee Table with twitter bootstrap</title>   
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
</head>  
<body style="margin:20px auto">  
    <table id="myTable" class="table table-striped" >  
        <thead>  
          <tr>  
            <th>ENO</th>  
            <th>EMPName</th>  
            <th>Country</th>  
            <th>Salary</th>  
          </tr>  
        </thead>  
        <tbody>  
          <tr>  
            <td>001</td>  
            <td>Anusha</td>  
            <td>India</td>  
            <td>10000</td>  
          </tr>  
          <tr>  
        <td>002</td>  
        <td>Charles</td>  
        <td>United Kingdom</td>  
        <td>28000</td>  
      </tr>  
      <tr>  
        <td>003</td>  
        <td>Sravani</td>  
        <td>Australia</td>  
        <td>7000</td>  
      </tr>  
       <tr>  
        <td>004</td>  
        <td>Amar</td>  
        <td>India</td>  
        <td>18000</td>  
      </tr>  
      <tr>  
        <td>005</td>  
        <td>Lakshmi</td>  
        <td>India</td>  
        <td>12000</td>  
      </tr>  
      <tr>  
        <td>006</td>  
        <td>James</td>  
        <td>Canada</td>  
        <td>50000</td>  
      </tr>  

       <tr>  
        <td>007</td>  
        <td>Ronald</td>  
        <td>US</td>  
        <td>75000</td>  
      </tr>  
      <tr>  
        <td>008</td>  
        <td>Mike</td>  
        <td>Belgium</td>  
        <td>100000</td>  
      </tr>  
    </tbody>  
  </table>  
</body>  
</html>

也许您网页上还有其他内容干扰了它?