-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
38 lines (38 loc) · 1.37 KB
/
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
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DPSChat</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
</head>
<body>
<div id="box" style="overflow-y: scroll; height:400px;">
</div>
<div> <input type="text" id="type" style="width: 250px" onkeyup="enter();"><button class="btn btn-light" id="submit" onclick="submit();">Enter</button></div>
<script>
$("#box").append("Welcome to DPSChat!<br>");
var socket = new WebSocket('ws://localhost:8080');
socket.onopen = function (event) {
$("#box").append("Connection Succeed!<br>");
};
socket.onmessage = function (event) {
console.log(event.data);
$("#box").append(event.data + "<br>");
};
function submit() {
var Value = $("#type").val();
$("#type").val("");
socket.send(Value);
}
function enter() {
if (event.keyCode == 13) submit();
}
</script>
</body>
</html>