通过html按钮单击更新html页面上的javascript变量？

Question

我正在制作一个基本程序，向用户显示当前的室温以及文本字段和“设置”按钮，以便他们可以设置所需的室温。 我想发生的是，当用户在文本字段中输入数字并单击“设置”按钮时，它将“ roomTemp”变量更改为所需的温度（也称为“ desiredTemp”）并将其显示为当前温度。 我不认为它到达了save（）函数，因为当单击按钮时，它应该输出“温度正在变化！”时，控制台上什么也没有打印 到我的控制台。

Javascript文件：

var http = require('http');
var ejs = require('ejs');
var fs = require('fs');
var roomTemp = 20;
var desiredTemp = 0;

http.createServer(function(req,res) {
  res.writeHead(200, {'Content-Type': 'text/html'});

  //since we are in a request handler function
  //we're using readFile instead of readFileSync
  fs.readFile('index.html', 'utf-8', function(err, content) {
    if (err) {
      res.end('error occurred');
      return;
    }

    var renderedHtml = ejs.render(content, {roomTemp: roomTemp});  //get redered HTML code
    res.end(renderedHtml);
  });
}).listen(3000, "127.0.0.1");
console.log('Server Running at http://127.0.0.1:3000  CNTL-C to quit');

HTML档案：

<!DOCTYPE html>
<html>
<head>
<script src="Thermostat.js"></script>
</head>
<body>

Current Temp: <%= roomTemp %> <br></br>

<form>
Desired Room Temperature: <input type="number" id="desTemp" name="roomTempDes"><br></br>
<button onclick="save(document.getElementById("roomTempDes").value)">Set</button>
</form>

<script>
function save(desiredTemp) {
      roomTemp = desiredTemp;
      console.log("Temperature is changing!");
}
</script>

</body>
</html>

Answer 1

脚本中的引号太多。

"save(document.getElementById("roomTempDes").value)"

应该

"save(document.getElementById('roomTempDes').value)"

Answer 2

您的代码引用不正确，并且您有错误的ID。

<button onclick="save(document.getElementById('desTemp').value)">Set</button>

通过html按钮单击更新html页面上的javascript变量？

问题描述

2 个解决方案

解决方案1
2 2014-10-21 13:10:30

解决方案2
0 2014-10-21 13:12:57

通过html按钮单击更新html页面上的javascript变量？

问题描述

2 个解决方案

解决方案1 2 2014-10-21 13:10:30

解决方案2 0 2014-10-21 13:12:57

解决方案1
2 2014-10-21 13:10:30

解决方案2
0 2014-10-21 13:12:57