我花了两天时间寻找答案，虽然我遇到了很多答案，但没有一个对我有帮助。我正在构建一个带有选项卡的网站，并在其中一个选项卡中加载一个名为 page2.html 的 html。
page2.html代码:
<!DOCTYPE html>
<html>
<head>
<title>Positions</title>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.dataTables/1.9.4/jquery.dataTables.js"></script>
<script src="sharedFunctions.js"></script>
<script src="positions/page2.js"></script>
</head>
<body>
<button id="togglePositionForm" onclick="toggleForm('position',this.id)"></button>
<div id="createNewPositionForm" hidden>
<form id="position" name="position" method="post" onsubmit="saveNewPosition()">
<p class="ui-widget-header" id="newPostionHeader" >General Info</p>
Position Name: <input type="text" id="positionName" name="positionName" value="test1"><br>
Entry Date: <input type="text" id="datepicker" name="datepicker" ><br>
Init Value: <input type="text" id="initValue" name="initValue" value=""><br>
Init Price: <input type="text" id="initPrice" name="initPrice" value=""><br>
Init Stop: <input type="text" id="initStop" name="initStop" value=""><br>
Current Price: <input type="text" id="currentPrice" name="currentPrice" value=""><br>
Current Value: <input type="text" id="currentValue" name="currentValue" value=""><br>
Gain/Loss(%): <input type="text" id="gainLossInPerc" name="gainLossInPerc" value="Automatic Calc"><br>
<input type="submit" value="submit">
</form>
</div>
</br>
</br>
</br>
</br>
<table id="positionsSummeryTable">
<thead>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
我的index.html代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.1.js"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/themes/dot-luv/jquery-ui.css" rel="stylesheet">
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.3/jquery-ui.js"></script>
<script src="index.js"></script>
</head>
<body>
<h1>Trader's Friend</h1>
<!-- Tabs -->
<div id="tabs">
<ul>
<li><a href="positions/page2.html">Positions</a></li>
<li><a href="portfolios/page1.html">Portfolios</a></li>
<li><a href="#tabs-1">Market Overview</a></li>
</ul>
<div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
</div>
</body>
</html>
我还有一个带有 document.ready 函数的 page2.js ，其中包含以下 dataTables 代码:
$('#positionsSummeryTable').dataTable(
{
"aaData": [
[ "Trident", "Internet Explorer 4.0", "Win 95+", 4, "X" ],
[ "Trident", "Internet Explorer 5.0", "Win 95+", 5, "C" ],
[ "Trident", "Internet Explorer 5.5", "Win 95+", 5.5, "A" ],
[ "Trident", "Internet Explorer 6.0", "Win 98+", 6, "A" ],
[ "Trident", "Internet Explorer 7.0", "Win XP SP2+", 7, "A" ],
[ "Gecko", "Firefox 1.5", "Win 98+ / OSX.2+", 1.8, "A" ]
],
"aoColumns" : [
{"sTitle" : "Position#"},
{"sTitle" : "Name"},
{"sTitle" : "Entry Date"},
{"sTitle" : "Init Value"}
]
}
);
我正在使用 wampserver 在本地运行。
我的问题:在 Chrome 和 Firefox 中运行会出现相同的错误:
未捕获类型错误:对象 [object Object] 没有方法“dataTable”
我看到一些答案谈论: 1.确保在dataTables.js之前src jQuery.js 2.确保我确实src dataTables.js 3.确保我不会重复采购任何东西(例如 jQuery.js) ...
我想我检查了所有这些情况，我的代码看起来很简单，但我找不到这个错误的原因。
有人知道如何解决这个问题吗？
提前致谢 希文
最佳答案
尝试将 dataTables 插件脚本调用从Page2.html 移动到 Index.html
关于jquery - 未捕获的类型错误 : Object [object Object] has no method 'dataTable' ，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16799674/