/
index.html
28 lines (25 loc) · 860 Bytes
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<p id="messages"></p>
<form id="form" action="">
<input id="room" placeholder="room" autocomplete="off" /><br>
<input id="input" placeholder="message" autocomplete="off" /><button>Send</button>
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.js"></script>
<script>
var socket = io();
var messages = document.getElementById('messages');
var form = document.getElementById('form');
var input = document.getElementById('input');
form.addEventListener('submit', function(e) {
e.preventDefault();
if (input.value) {
let data = {room:room.value, msg:input.value};
socket.emit('join', data);
input.value = '';
}
});
socket.on('chat message', function(msg) {
var item = document.createElement('p');
item.textContent = msg;
messages.appendChild(item);
});
</script>