HTML&JavaScript未捕获引用错误:未定义addTable

HTML & JavaScript Uncaught ReferenceError: addTable is not defined

本文关键字：错误 引用 未定义 addTable amp JavaScript HTML      更新时间：2024-06-30

我有一个javascript文件，其中包含一些数据数组和一个函数。当html页面加载并单击按钮时，我使用此功能在页面上显示一个表。我得到的错误是：

得到http://localhost:3000/views/table.jscontracts.html:84

未捕获引用错误：addTable未定义合约。html:84 onclick

我的contracts.html文件如下：

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="/css/portalstyle.css"> 
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head> 
<body id="contracts">
<div id="wrapper">
<!-- Some Header code here -->
<div id="mytable"></div>
<div id="footer">
    <table id="footer" style="width: 100%">
      <tr>
        <td valign="bottom">Company Name
          <br />Tel Num
          <br />Location, Postcode</td>
        <td>
          <button onclick="addTable(ORDER.orders)">Click me</button>
        </td>
        <td align="right" valign="bottom">
          <a href="#">Home</a> &nbsp;<a href="#">About</a> &nbsp;<a href="#">Help</a> &nbsp;<a href="#">Contact</a>
        </td>
      </tr>
    </table>
  </div>
</div>
<hr />
<script src="http://getbootstrap.com/dist/js/bootstrap.min.js"></script>
<script src="../views/table.js"></script>
</body>

</html>

我的javascript函数文件名为table.js，包含：

var ORDER = {
  orders: []
};
function Order(ref, grower, item) {
  this.order_reference = ("o" + ref);
  this.grower_reference = grower;
  this.item_ordered = item;
}
var order1 = new Order(1, "grower2", "item");
ORDER.orders.push(order1);
function addTable(orders) {
  var table = document.createElement("TABLE");
  table.setAttribute("id", "myTable");
  document.body.appendChild(table);
  for (var i = 0; i < orders.length; i++) {
    var order = orders[i];
    var row = document.createElement("TR");
    var refCell = document.createElement("TD");
    var growerCell = document.createElement("TD");
    var itemCell = document.createElement("TD");
    row.appendChild(refCell);
    row.appendChild(growerCell);
    row.appendChild(itemCell);
    var ref = document.createTextNode(order.order_reference);
    var grower = document.createTextNode(order.grower_reference);
    var item = document.createTextNode(order.item_ordered);
    refCell.appendChild(ref);
    growerCell.appendChild(grower);
    itemCell.appendChild(item);
    table.appendChild(row);
    document.body.appendChild(document.createElement('hr'));
  }
}
window.addEventListener('load', function() {
  addTable(ORDER.orders)
});

我需要在哪里定义addTable？我该怎么做？

此外，GET的错误。这是我包含脚本的行。如何阻止此错误的发生？

感谢您的建议。他们帮助我查看正确的代码以找到错误，所以我没有修复它

我的文件夹和指定的路径出现错误。我最初在"视图"文件夹中有一个.js文件，正在使用/views/table.js。这引发了未定义的错误，所以我创建了一个名为"js"的新文件夹，并将文件复制到这里，并使用/js/table.js指定了它，现在它可以工作了。

据我所知在我所在文件夹的父目录中查找，而我需要两个文件夹，所以从根目录开始搜索，找到一个名为js的文件夹，然后按预期找到addTable函数。

相关文章：