2

我花了两天时间寻找答案，虽然我遇到了很多答案，但没有一个能帮助我。我正在构建一个带有标签的网站，在其中一个标签中我加载了一个名为 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 中运行会出现同样的错误：

未捕获的类型错误：对象 [对象对象] 没有方法“数据表”

我看到一些答案在谈论： 1. 确保我在 dataTables.js 之前 src jQuery.js 2. 确保我实际上是 src dataTables.js 3. 确保我没有两次采购任何东西（例如 jQuery.js）.. .

我想我检查了所有这些情况，我的代码看起来很简单，但我找不到这个错误的原因。

有人知道如何解决这个问题吗？

在此先感谢西万

4

1 回答 1

2

尝试将 dataTables 插件脚本调用从 Page2.html 移动到 Index.html

于 2013-10-18T10:46:20.737 回答