gpt4 book ai didi

javascript - 引用在codesandbox网站中使用onclick时出现错误

转载 作者:行者123 更新时间:2023-12-03 00:24:43 25 4
gpt4 key购买 nike

我正在codesandbox环境中编写Vanilla JS程序,如下所示:

function Game() {
alert("hi");
}
body {
font-family: sans-serif;
}

table {
border-collapse: collapse;
}

td {
border: 1px solid black;
}

td:first-child {
border-left-width: 0px;
}

td:last-child {
border-right-width: 0px;
}

table tr:nth-child(1) td {
border-top-width: 0px;
}

table tr:nth-child(3) td {
border-bottom-width: 0px;
}
<!DOCTYPE html>
<html>
<head>
<title>Tic-Tac-Toe</title>
<meta charset="UTF-8" />

</head>

<body>
<div id="app">
<table width="300" height="300" onclick="Game();">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</div>
</body>
</html>

当我在 codesandbox.io 中执行上述代码片段时然后它给出以下错误:

ReferenceError Game is not defined

不知道为什么codesandbox的执行环境无法检测到Game函数。如果我在函数外部编写 alert 语句,那么它会在页面加载时成功调用:

alert("hi");

function Game() {

}

我已经在 HTML 页面的 head 标签中正确链接了外部 JS 和 CSS 文件。

最佳答案

您需要将该函数定义为附加到全局 window 对象的变量。尝试像这样定义函数:

window.Game = function() {
alert("hi");
}

或者,尝试为 table 元素提供一个 id(例如 game-table),而不是内联 onclick 事件处理程序,然后添加一个事件听众:

document.querySelector('#game-table').addEventListener('click', Game);

关于javascript - 引用在codesandbox网站中使用onclick时出现错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54140964/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com