Function 未定义 node.js 未捕获参考错误
[英]Function is not defined node.js Uncaught Reference error
问题描述
In my app.js file I defined a function like this:
在我的 app.js 文件中，我定义了一个 function，如下所示：
function testfunc() {
console.log("Testing");
}
And in my home.html file I have this:在我的 home.html 文件中，我有这个：
<script type="text/javascript" src="./app.js"></script>
<div class="ProfileImage" onmouseover="testfunc()"> </div>
but when I mouseover the div it produces this但是当我将鼠标悬停在 div 上时，它会产生这个
Uncaught ReferenceError: testfunc is not defined
Here is my file structure:这是我的文件结构：
4 个解决方案
解决方案1
0 2021-05-09 23:49:32
Make sure your HTML File follows the below structure.确保您的 HTML 文件遵循以下结构。 I am unable to exactly answer as I cannot get your JS logs我无法准确回答，因为我无法获取您的 JS 日志
<html> <head>... </head> <body>... <div class="ProfileImage" onmouseover="testfunc()">abcdefg</div> <script> function testfunc() { console.log("Testing"); } </script> </body> </html>
解决方案2
0 2021-05-10 00:58:43
Make sure your JS file is in the same directory as your HTML file.确保您的 JS 文件与 HTML 文件位于同一目录中。 Otherwise it will not find it.否则它不会找到它。
解决方案3
0 2021-05-18 11:53:53
Why did you forget that the internet is asynchronous?为什么你忘记了互联网是异步的？ You want to run a function from a file that is not loaded yet?您想从尚未加载的文件中运行 function 吗？
If you want use events in this way, the JS code must be embedded in HTML.如果你想以这种方式使用事件，JS 代码必须嵌入到 HTML 中。
If you want to do it right, read about DOMContentLoaded (JS execution after all HTML is loaded), addEventListener (event logging) and why JS scripts should be appended to the end of HTML.如果您想正确执行此操作，请阅读有关DOMContentLoaded （加载所有 HTML 后执行 JS）、 addEventListener （事件日志记录）以及为什么应将 JS 脚本附加到 HTML 末尾的内容。
Besides, I recommend that you be interested in fetch () (Ajax replacement) and document.querySelector (selectors);此外，我建议您对fetch () （Ajax 替换）和document.querySelector (selectors); (instead of jQuery (selectors) ). （而不是jQuery (selectors) ）。
解决方案4
0 2021-05-20 20:35:41
Edited answer:编辑答案：
It also looks like the file app.js is not loaded inside the file- home.html .看起来app.js文件也没有加载到文件home.html中。 Make sure your node.js server serves both files - app.js and home.html .确保您的 node.js 服务器同时提供两个文件 - app.js和home.html 。
You may verify it by opening these URLs: yourServerUrl:port/app.js and yourServerUrl:port/home.html您可以通过打开以下 URL 来验证它： yourServerUrl:port/app.js和yourServerUrl:port/home.html
- Demo : click here演示：点击这里
Old answer:老答案：
As mentioned in the question (node.js), it looks like you want to call a server-side function (ie testFunc() ) from the home.html file.如问题（node.js）中所述，您似乎想从home.html文件中调用服务器端 function （即testFunc() ）。
For that, please follow these steps:为此，请按照以下步骤操作：
Add the following code in your
app.jsfile.在您的app.js文件中添加以下代码。 This code creates an HTTP server to servehome.htmlandtestFunc()这段代码创建了一个 HTTP 服务器来服务home.html和testFunc()const http = require("http"); const fs = require("fs"); function testfunc() { console.log("Testing"); } http.createServer(function (req, res) { if (req.url === "/testfunc") { testfunc(); //Trigger testfunc res.write("testfunc() triggered"); //return response to the client (optional) res.end(); } else { //Return default web page fs.readFile(__dirname + "/home.html", function (err, data) { if (err) { res.writeHead(404); res.end(JSON.stringify(err)); return; } res.writeHead(200); res.end(data); }); } }).listen(8080);Add the following code in the
home.htmlfile.在home.html文件中添加以下代码。 To trigger the server-side function, we've used the AJAX library.为了触发服务器端 function，我们使用了 AJAX 库。<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <div class="ProfileImage" onmouseover="askServerToCallTestFunc()" style="width: 50px; height: 50px; background: red;" ></div> <script type="text/javascript"> function askServerToCallTestFunc() { $.get("/testfunc", (resp) => { console.log("Response from server: ", resp); }); } </script>
- Demo : click here演示：点击这里
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.