<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.close {
color: gray;
}
.open {
color: blue;
}
</style>
</head>
<body>
<input id="input_temp" type="text"></input>
<button id="set_temp" onclick="bt_setTemp()">ตั้งค่าอุณหภูม<
ิ /button>
<p id="text_setT"></p>
<button onclick="ReadTemp()">อ่านค่าอุณหภูม<
ิ /button>
<p id="AirStatus"></p>
<script>
var setpoint;
function bt_setTemp() {
setpoint = document.getElementById("input_temp").value;
console.log(setpoint);
document.getElementById("text_setT").innerHTML = "Set
temperature: " + setpoint;
}
function ReadTemp() {
let ran_temp = parseInt((Math.random() * 10).toFixed(0));
document.getElementById("AirStatus").innerHTML = "Temp: " +
ran_temp;
if (ran_temp > setpoint) {
document.getElementById("AirStatus").innerHTML = "Temp: " +
ran_temp + " compressor Open";
document.getElementById("AirStatus").classList.add("open");
document.getElementById("AirStatus").classList.remove("close");
console.log(ran_temp + " open");
}
else {
document.getElementById("AirStatus").innerHTML = "Temp: " +
ran_temp + " compressor Close";
document.getElementById("AirStatus").classList.add("close");
document.getElementById("AirStatus").classList.remove("open");
console.log(ran_temp + " close");
}
}
</script>
</body>
</html>