JavaScript&；HTML:onclick按钮运行javascript函数？_Javascript_Html_Dom_Socket.io_Electron

JavaScript&；HTML:onclick按钮运行javascript函数？

javascript html dom socket.io electron

JavaScript&；HTML:onclick按钮运行javascript函数？,javascript,html,dom,socket.io,electron,Javascript,Html,Dom,Socket.io,Electron,我正在使用electron和socket.io设置GUI服务器应用程序。我无法使用index.html中的onclick按钮来运行server.js中的startServer（）函数。我需要帮助我尝试使用ID和事件侦听器来运行该函数。非常感谢您的帮助，谢谢 main.js： const electron = require('electron') const app = electron.app const BrowserWindow = electron.BrowserWindow con

我正在使用electron和socket.io设置GUI服务器应用程序。我无法使用

index.html

中的onclick按钮来运行

server.js

中的

startServer（）

函数。我需要帮助

我尝试使用ID和事件侦听器来运行该函数。非常感谢您的帮助，谢谢

main.js：

const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow

const path = require('path')

let mainWindow

function createWindow() {
  mainWindow = new BrowserWindow({
    height: 500,
    width: 700,
    frame: false,
    resizable: false,
    webPreferences: {
      nodeIntegration: true
    }
  });

  // Load html into window
  mainWindow.loadURL('file://' + __dirname + '/app/index.html');

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}

// Listen for app to be ready
app.on('ready', createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow()
  }
})

index.html：

<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="app.css">
</head>
<body>
  <script>server.js</script>
  <div class="disable-highlight">
    <h1>DNPS
    </h1>
  </div>
  <input type="button" onclick="startServer()" value="Start Server" />
  <script>
    require('./server.js')
  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="app.css">
</head>
<body>
  <div class="disable-highlight">
    <h1>DNPS</h1>
  <input id="startBtn" type="button" value="Start Server"/>
  <script>require('./server.js')</script>
  <table class='center'>
    <td id="consoleLog">
    </td>
  </table>
  </div>
</body>
</html>


server.js
DNPS
需要（“./server.js”）

server.js：

const log = require('electron-log')

function startServer() {
  // Load Socket.io
  var app = require('express')();
  var http = require('http').createServer(app);
  var io = require('socket.io')(http);

  app.get('/', function(req, res){
    res.send('<h1>Hello world</h1>');
  });

  io.on('connection', function(socket){
    log.info('a user connected')
  });

  http.listen(3000, function(){
    log.info('listening on *:3000');
  });
};

const log = require('electron-log')

// Load Socket.io
const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);

var tempLog = ''

function pushLog() {
  document.getElementById('consoleLog').innerHTML = tempLog
}

document.getElementById('startBtn').onclick = function() {
  app.get('/', function(req, res){
    res.sendFile(__dirname + '/output/index.html');
  });

  log.info('pushing index.html to localhost')
  tempLog += 'pushing index.html to localhost<br>'

  io.on('connection', function(socket){
    tempLog += 'a user connected<br>'
    log.info('a user connected<br>')
    pushLog()
  });

  http.listen(3000, function(){
    tempLog += 'listening on *:3000<br>'
    log.info('listening on *:3000');
    pushLog()
  });
};

const log=require（'electron-log'））
函数startServer（）{
//加载Socket.io
var app=require（'express'）（）；
var http=require（'http'）。createServer（应用程序）；
var io=require（'socket.io'）（http）；
app.get（'/'，函数（req，res）{
res.send（“你好世界”）；
});
io.on（'连接'，函数（套接字）{
log.info（'已连接的用户'）
});
http.listen（3000，函数（）{
log.info（'监听*：3000'）；
});
};

经过多次修改，我发现

document.getElementById

对我有效

index.html：

<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="app.css">
</head>
<body>
  <script>server.js</script>
  <div class="disable-highlight">
    <h1>DNPS
    </h1>
  </div>
  <input type="button" onclick="startServer()" value="Start Server" />
  <script>
    require('./server.js')
  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <link rel="stylesheet" href="app.css">
</head>
<body>
  <div class="disable-highlight">
    <h1>DNPS</h1>
  <input id="startBtn" type="button" value="Start Server"/>
  <script>require('./server.js')</script>
  <table class='center'>
    <td id="consoleLog">
    </td>
  </table>
  </div>
</body>
</html>


DNPS
需要（“./server.js”）

server.js：

const log = require('electron-log')

function startServer() {
  // Load Socket.io
  var app = require('express')();
  var http = require('http').createServer(app);
  var io = require('socket.io')(http);

  app.get('/', function(req, res){
    res.send('<h1>Hello world</h1>');
  });

  io.on('connection', function(socket){
    log.info('a user connected')
  });

  http.listen(3000, function(){
    log.info('listening on *:3000');
  });
};

const log = require('electron-log')

// Load Socket.io
const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);

var tempLog = ''

function pushLog() {
  document.getElementById('consoleLog').innerHTML = tempLog
}

document.getElementById('startBtn').onclick = function() {
  app.get('/', function(req, res){
    res.sendFile(__dirname + '/output/index.html');
  });

  log.info('pushing index.html to localhost')
  tempLog += 'pushing index.html to localhost<br>'

  io.on('connection', function(socket){
    tempLog += 'a user connected<br>'
    log.info('a user connected<br>')
    pushLog()
  });

  http.listen(3000, function(){
    tempLog += 'listening on *:3000<br>'
    log.info('listening on *:3000');
    pushLog()
  });
};

const log=require（'electron-log'））
//加载Socket.io
const-app=require（'express'）（）；
const http=require（'http'）。createServer（应用程序）；
const io=require（'socket.io'）（http）；
var templag=''
函数pushLog（）{
document.getElementById（'consoleLog'）。innerHTML=tempLog
}
document.getElementById（'startBtn'）。onclick=function（）{
app.get（'/'，函数（req，res）{
res.sendFile（uu dirname+'/output/index.html'）；
});
log.info（'将index.html推送到本地主机'）
tempLog+=“将index.html推送到本地主机
”
io.on（'连接'，函数（套接字）{
tempLog+=“已连接的用户
”
log.info（'a user connected
'）
pushLog（）
});
http.listen（3000，函数（）{
tempLog+=“正在收听*：3000
”
log.info（'监听*：3000'）；
pushLog（）
});
};

您的文件

server.js

没有正确的节点模块结构。而且你也没有正确地使用它。查看关于如何在JavaScipt中编写和使用模块的教程这里有一个

main.js

的节点模块。如果我启动

main.js

，那么

server.js

启动没有问题，如果我删除外围的

函数startServer（）{…}

，但是我需要

函数startServer（）{…}

因此，我可以使用html中的按钮调用函数，但它不允许我调用。这就好像

socket.io

必须在脚本加载时启动，而不是在函数中调用，但我不明白为什么不能启动？