为什么没有定义getActivityTables()?脚本链接正确,函数名在html和js文件中相同。
我哪里做错了?
超文本:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Fitnessapp</title>
<script src="scripts.js"></script>
</head>
<body onload="getActivityTables()">
<div id="" class="container">
<div class="activityDiv">
<h1>Running Activities</h1>
<table id="runningActivity-table" class="table">
</table>
</div>
</div>
</body>
</html>
JS(脚本. js):
function getActivityTables() {
console.log("test");
// Get runningActivity-table
let xhttp = new XMLHttpRequest();
xhttp.onload = function () {
let response;
let responseString = xhttp.responseText;
response = JSON.parse(responseString);
console.log(response);
let table = document.getElementById("runningActivity-table");
let row, cell;
let header = table.createTHead();
row = header.insertRow(0);
cell = row.insertCell();
cell.innerHTML = "ID";
cell = row.insertCell();
cell.innerHTML = "Date";
cell = row.insertCell();
cell.innerHTML = "Duration";
cell = row.insertCell();
cell.innerHTML = "Distance";
cell = row.insertCell();
cell.innerHTML = "Description";
for (let i = 0; i < response.length; i++) {
row = table.insertRow();
cell = row.insertCell();
cell.textContent = response[i].id;
cell = row.insertCell();
cell.textContent = response[i].dateOfCreation;
cell = row.insertCell();
cell.textContent = response[i].durationInMinutes;
cell = row.insertCell();
cell.textContent = response[i].distanceInKm;
cell = row.insertCell();
cell.textContent = response[i].description;
}
}
xhttp.open("GET", "/getRunningActivities");
xhttp.send();
}
我找不到问题所在。我有另一个页面完全相同的代码,并且工作正常。
2条答案
按热度按时间thtygnil1#
我完全复制了你的整个代码在我的vs代码,并启动它,一切都工作。
getActivityTables
函数工作正常。但是你可以尝试在javascript本身里面使用
addEventListener()
,它比常规的html事件属性要好。但是你的代码没有任何问题,我自己试过了。
你可以在浏览器中捕获控制台和网络选项卡,然后我们就可以找出发生了什么。
axkjgtzd2#
尝试从head标记中删除
<script src="scripts.js"></script>
并将其放在Body标记的末尾像这样:
如果scripts.js文件中仍然存在问题,请添加: