Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
244 views
in Technique[技术] by (71.8m points)

javascript - TypeError:$(…).DataTable不是函数(TypeError: $(…).DataTable is not a function)

I am trying to work with jQuery's Datatable JS for my project from this link.

(我正在尝试通过链接为我的项目使用jQuery的Datatable JS。)

I downloaded the complete library from the same source.

(我从同一来源下载了完整的库。)

All the examples given in the package seem to work fine, but when I try to incorporate them in my WebForms ,the CSS,JS do not work at all.

(软件包中给出的所有示例似乎都可以正常工作,但是当我尝试将其合并到WebForms ,CSS,JS根本不起作用。)

Here is what I have done :

(这是我所做的:)

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table id="myTable" class="display" cellspacing="0" width="100%">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Position</th>
                    <th>Office</th>
                    <th>Age</th>
                    <th>Start date</th>
                    <th>Salary</th>
                </tr>
            </thead>
            <tfoot>
                <tr>
                    <th>Name</th>
                    <th>Position</th>
                    <th>Office</th>
                    <th>Age</th>
                    <th>Start date</th>
                    <th>Salary</th>
                </tr>
            </tfoot>
            <tbody>
               <!-- table body -->
            </tbody>
        </table>
    </div>
    <script src="js/jquery.dataTables.js" type="text/javascript"></script>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#myTable').DataTable();
        });
    </script>
    </form>
</body>
</html>

My file structure for the JS and CSS in my Solution looks as follows :

(我的解决方案中的JS和CSS文件结构如下:)

解决方案中JS和CSS的文件结构

I have added all the necessary JS and CSS references as shown in the manual.

(我已经添加了所有必要的JS和CSS参考,如手册中所示。)

Still the rendering isn't as expected.

(渲染仍然不符合预期。)

There is no CSS and even the JS doesn't work.

(没有CSS,甚至JS也无法使用。)

Also in the console i get the following errors:

(同样在控制台中,我得到以下错误:)

ReferenceError: jQuery is not defined
TypeError: $(...).DataTable is not a function

I have still not bound any dynamic data here (like within a repeater or so) still it is not working.

(我仍然没有在这里绑定任何动态数据(例如在转发器之内),但仍然无法正常工作。)

Can someone please guide me in the right direction for this problem ?

(有人可以指导我解决这个问题的正确方向吗?)

  ask by Abhishek Ghosh translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

CAUSE(原因)

There could be multiple reasons for this error.

(此错误可能有多种原因。)

  • jQuery DataTables library is missing.

    (缺少jQuery DataTables库。)

  • jQuery library is loaded after jQuery DataTables.

    (jQuery库 jQuery DataTables 之后加载。)

  • Multiple versions of jQuery library is loaded.

    (加载了多个版本的jQuery库。)

SOLUTION(解)

Include only one version of jQuery library version 1.7 or newer before jQuery DataTables.

( jQuery DataTables 之前 包含一个版本的jQuery库1.7或更高版本。)

For example:

(例如:)

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

See jQuery DataTables: Common JavaScript console errors for more information on this and other common console errors.

(有关此错误和其他常见控制台错误的更多信息,请参见jQuery DataTables:常见JavaScript控制台错误。)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...