对象 [object Object] 没有方法“footable”答案

【问题标题】：Object [object Object] has no method 'footable'对象 [object Object] 没有方法“footable”
【发布时间】：2013-10-11 21:56:16
【问题描述】：

我计划为我的表格使用footable jQuery 插件以使其具有响应性，但我未能将其集成到我的网站中。这是我的 CSS：

<link href="FooTable-2/css/footable.core.css?v=2-0-1" rel="stylesheet" type="text/css"/>
<link href="FooTable-2/css/footable.metro.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="FooTable-2/js/footable.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.sort.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.filter.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.paginate.js?v=2-0-1" type="text/javascript"></script>
<script src="build/javascripts/application.js" type="text/javascript"></script>

JS：

<script type="text/javascript">
    $(function () {
        $('.footable').footable();
    });
</script>

HTML：

<table class="footable">
<thead>
<tr>
  <th></th>
  <th data-hide="phone,tablet">Nummer</th>
  <th>Vorname</th>
  <th>Nachname</th>
  <th>Adresse</th>
  <th data-hide="phone,tablet">Telefon</th>
  <th>E-Mail</th>
  <th data-hide="phone,tablet">Geburtstag</th>
  <th>Kundentyp</th>
</tr>
</thead>
<tbody>

错误：

$('.footable').footable(); 
Uncaught TypeError: Object [object Object] has no method 'footable'

控制台：

我该如何解决这个问题？

【问题讨论】：

确保您的脚本引用正确。检查浏览器开发工具的网络选项卡是否存在 404 错误。
显然，插件没有加载。您应该在控制台中有其他错误告诉您原因。
没有 404 错误。我之前检查过。

标签： jquery html css jquery-plugins footable

【解决方案1】：

application.js (Bootstrap 3.0) 和footable.js 之间似乎存在某种冲突。我重新排列了包含的顺序并能够解决问题：

application.js 现在包含在第一个脚本中：

<script src="build/javascripts/application.js" type="text/javascript"></script>

在那之后，我包含了所有的 FooTable 脚本和 CSS 文件：

<link href="FooTable-2/css/footable.core.css?v=2-0-1" rel="stylesheet" type="text/css"/>
<link href="FooTable-2/css/footable.metro.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="FooTable-2/js/footable.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.sort.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.filter.js?v=2-0-1" type="text/javascript"></script>
<script src="FooTable-2/js/footable.paginate.js?v=2-0-1" type="text/javascript"></script>

【讨论】：