HTML和JavaScript未捕获引用错误:未定义addTable
我有一个javascript文件,其中包含一些数据数组和一个函数。我使用这个函数在html页面上显示一个表,当它加载时,点击一个按钮。我得到的错误是: 获取合同。html:84 未捕获引用错误:未定义addTable。html:84 onclick My contracts.html文件如下所示:HTML和JavaScript未捕获引用错误:未定义addTable,javascript,html,Javascript,Html,我有一个javascript文件,其中包含一些数据数组和一个函数。我使用这个函数在html页面上显示一个表,当它加载时,点击一个按钮。我得到的错误是: 获取合同。html:84 未捕获引用错误:未定义addTable。html:84 onclick My contracts.html文件如下所示: <!DOCTYPE html> <html lang = "en"> <head> <meta charset="utf-8"> <meta na
<!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> <a href="#">About</a> <a href="#">Help</a> <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函数。你确定引用table.js的方法正确吗?它可以通过开发者工具在页面上找到吗?我不确定。。。很抱歉如果在开发工具上,它应该在哪里?在dev tools上,my contracts.html似乎位于views文件夹下,但其中没有其他内容。这就是你的意思吗?假设你正在使用谷歌浏览器,查看“资源”选项卡。是的,我是。好啊我看不到table.js。。。只有我的contracts.html页面和css文件-我应该如何引用该表?我已经使用../views/table.js作为脚本标记的src,但这似乎不起作用。我不知道你有什么文件夹结构,所以你必须通过尝试javascript文件的不同路径自己找到它。