Question

我正在尝试使用index.html将我的Thermostat.js文件中的变量显示在我的网页上，我要传递到网页的变量名是“roomTemp”。我搜索了一些，这就是我想出来的但是我在我的javascript文件第5行“$（'＃printHere'）。html（roomTemp）;我的控制台中得到了一个引用错误”$ is not defined“。 ”

Thermostat.js

var http = require('http'); //need to http
var fs = require('fs'); //need to read static files
var roomTemp=20;
$('#printHere').html(roomTemp);

//this function is identical to the serve file function from the course web page
//it will read the contents of a file and serve them as the specified content type
//this is only used to serve the static index page
function serveStaticFile(res, path, contentType, responseCode){
   if(!responseCode) responseCode = 200;
   fs.readFile(__dirname + path, function(err, data){
     if(err){
       //for now use success code
       res.writeHead(200, {'Content-Type': 'text/plain'});
       res.end('500 INTERNAL FILE ERROR' + '\n');
     }
     else {
       res.writeHead(responseCode , {'Content-Type': contentType});
       res.end(data);
     }
   });
}

//this function is nearly identical to the routing examples from the course web page
http.createServer(function (request,response){
   var path = request.url.replace(/\/?(?:\?.*)$/,'').toLowerCase();

   switch(path){
     //serve the static index page
     case '/index.html':
       serveStaticFile(response,
                       '/index.html',
                       'text/html');
       break;

     default:
       serveStaticFile(response,
                       '/index.html',
                       'text/html');
       break;
}

}).listen(3000, "127.0.0.1");
console.log('Server Running at http://127.0.0.1:3000  CNTL-C to quit');

function save() {
      var desTemp;
      desTemp = document.getElementById("desTemp").value;
      roomTemp = desTemp;
}

的index.html

<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
</head>
<body>

<p>Current Temp: <span id="printHere"></span></p>

<form action="demo_form.asp">
Desired Room Temperature: <input type="number" id="desTemp" onchange="save()"><br>
</br>
<input type="submit" value="Set">
</form>

</body>
</html>

Answer 1

<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="Thermostat.js"></script>
</head>

您必须在脑中包含这些行{J}才能使用这些行。{1}}请记住为src =＆＃34;＆lt; .... \ Thermostat.js＆＃34;＆gt;

定义正确的路径

在你不包括你的JS之前，它不会起作用，并且jQuery JS必须包含在你的JS之前。

Answer 2

你对javascript，node.js脚本＆amp; ASP。

在你的thermostat.js中，它显然是node.js（服务器端）脚本。您不能在node.js上混合使用客户端脚本（jQuery）。

$('#printHere').html(roomTemp);

这一行试图搜索DOM并获取html值，这在服务器端无法完成

的index.html

<form action="demo_form.asp">

您正在创建一个html页面，其中包含一个提交到demo_form.asp的表单，这也是Microsoft提供的另一种服务器端技术（Active Server Pages）。

最后，$只是jQuery的简写，在进一步尝试之前，您需要正确理解您的软件堆栈。

'$未定义'将变量从javascript文件传递到html？

2 个答案:

的index.html