表单提交后socket.io聊天示例不起作用

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

io.on('connection', (socket) => {
  console.log('A user connected');

  socket.on('chat message', (msg) => {
    console.log('Message: ' + msg);
    io.emit('chat message', msg);
  });

  socket.on('disconnect', () => {
    console.log('A user disconnected');
  });
});

http.listen(3000, () => {
  console.log('Server is running on port 3000');
});

<script src="/socket.io/socket.io.js"></script>
<script>
  const socket = io();

  // 发送消息
  function sendMessage() {
    const message = document.getElementById('message').value;
    socket.emit('chat message', message);
    document.getElementById('message').value = '';
  }

  // 接收消息
  socket.on('chat message', (msg) => {
    const li = document.createElement('li');
    li.textContent = msg;
    document.getElementById('messages').appendChild(li);
  });
</script>

<form onsubmit="event.preventDefault(); sendMessage();">
  <input id="message" type="text" placeholder="输入消息" />
  <button type="submit">发送</button>
</form>

<ul id="messages"></ul>