weixin_43600278 2021-07-01 09:32 采纳率: 50%
浏览 204
已采纳

想问一问，这个怎么再添加一个灯，做到灯1和灯2分别控制呢？

img

img 源代码如下： 首先是index的

var express = require('express') var app = express()

var on = '0'

app.get('/get',function(req,res){ var data = { 'on':on } console.log(data) res.json(data) })

app.get('/set',function(req,res){ if(req.query.mon =="0" || req.query.mon == "1") on = req.query.mon var data = { 'on':on } console.log(data) res.json(data) })

//利用ejs模版显示web浏览器界面 app.set('view engine','ejs') app.get('/',function(req,res){ var state = "开" if(on == "0") state = "关" res.render("default",{lightState:state}) })

var server = app.listen(8000,function(){ var host = server.address().address; var port = server.address().port; console.log("addres:%s, port:%s",host,port) })

default的源代码：

<html><head><title>灯状态</title><script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script><script></script></head><body>

当前灯的状态:

<button>开灯</button> <button>关灯</button> </body></html>
  • 写回答

1条回答 默认 最新

  • CSDN专家-showbo 2021-07-02 09:07
    关注

    用一个json对象保存灯的状态就行了，方便扩展，然后html传递对应的id进行状态控制。帮助到你能点个采纳吗，谢谢~

    img

    index.js

    var express = require('express');
var app = express();
//灯状态，更多给json对象添加不同的键
var lightState = { light1: '关', light2: '关' }

app.get('/get', function (req, res) {
    var data = { 'on': lightState[req.query.attr] };
    console.log(data)
    res.json(data);
});

app.get('/set', function (req, res) {
    lightState[req.query.attr] = req.query.mon;
    var data = { on: lightState[req.query.attr] }
    console.log(data)
    res.json(data)
});

app.set('view engine', 'ejs')
app.get('/', function (req, res) {
    res.render('default', lightState)
});

var server = app.listen(8000, function () {
    var host = server.address().address;
    var port = server.address().port;
    console.log('addres:%s, port:%s',host,port)
})

    default.ejs

    <script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
    function changeState(state, id) {
        $.get('/set?mon=' + state+'&attr='+id, function (data, status) {
             $('#' + id).text(data.on);console.log(data)
        });
    }
</script>
<h2>当前等状态</h2>
<h1 style="color:#f00" id="light1"><%=light1%></h1>
<button onclick="changeState('开','light1')">开灯</button>
<button onclick="changeState('关','light1')">关灯</button>
<h1 style="color:#f00" id="light2"><%=light2%></h1>
<button onclick="changeState('开','light2')">开灯</button>
<button onclick="changeState('关','light2')">关灯</button>
<div style="height:300px"></div>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥100 set_link_state
  • ¥15 虚幻5 UE美术毛发渲染
  • ¥15 CVRP 图论 物流运输优化
  • ¥15 Tableau online 嵌入ppt失败
  • ¥100 支付宝网页转账系统不识别账号
  • ¥15 基于单片机的靶位控制系统
  • ¥15 真我手机蓝牙传输进度消息被关闭了，怎么打开？(关键词-消息通知)
  • ¥15 装 pytorch 的时候出了好多问题，遇到这种情况怎么处理？
  • ¥20 IOS游览器某宝手机网页版自动立即购买JavaScript脚本
  • ¥15 手机接入宽带网线，如何释放宽带全部速度