使用把手,Express和Node.js加载新页面onclick事件

时间:2019-03-11 21:31:23

标签: html node.js express express-handlebars

我是车把的新手,我不确定如何做到这一点。我有一个带有按钮的页面,可以带您到上传区域。在html中,我只是打开了一个新窗口。现在尝试实现车把,我似乎很困惑。这是我现在的代码。

server.js

const express = require('express');
const hbs  = require('express-handlebars');
const app = express();
const port = process.env.PORT || 5000;
const server = require('http').createServer(app);
const io = require('socket.io').listen(server);

var click1Count = 0;
var click2Count = 0;
var click3Count = 0;
var click4Count = 0;
var click5Count = 0;

app.engine( 'handlebars', hbs( {
  defaultLayout: 'main',
  layoutsDir: __dirname + '/views/layouts/',
  partialsDir: __dirname + '/views/partials/'
} ) );
app.set('views', __dirname + '/views');
app.set('view engine', 'handlebars');
app.use(express.static(__dirname + '/public'));
app.get('/', function (req, res) {
    res.render('home');
});

io.on('connection', function(client) {
    console.log('Client connected...');
    client.on('nest1', function(data) {
      click1Count++;
      io.emit('buttonUpdate1', click1Count);
    });
    client.on('nest2', function(data) {
          click2Count++;
          io.emit('buttonUpdate2', click2Count);
    });
    client.on('nest3', function(data) {
          click3Count++;
          io.emit('buttonUpdate3', click3Count);
    });
    client.on('nest4', function(data) {
          click4Count++;
          io.emit('buttonUpdate4', click4Count);
    });
    client.on('nest5', function(data) {
          click5Count++;
          io.emit('buttonUpdate5', click5Count);
    });
});

server.listen(port, function() {
  console.log('Forest server listening on port ' + port + ':');
  console.log(__dirname)
});

HTML部分

<div id="uploads" class="uploads">
    <button title="uploads" class="images" onclick=" window.open('uploads.handlebars', '_blank'); return false;">Uploads</button>
  </div>

0 个答案:

没有答案