node js 实现简单聊天室

最新推荐文章于 2024-07-01 19:37:12 发布

duzhenxun

最新推荐文章于 2024-07-01 19:37:12 发布

阅读量244

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/duzhenxun/article/details/89922825

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>NodeJS & WebSocket</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0" />
 
<script src="http://192.168.1.207:8888/socket.io/socket.io.js"></script>
<script type="text/javascript">
var socket = io.connect('http://192.168.1.207:8888/');
//Comet
socket.on('user message3', function(msg) {
//alert(data);
msgbox(msg.msg,msg.name);
});
 
function msgbox(str,name) {
var box = document.getElementById('box');
box.innerHTML += name+":"+str + '<br>';
}
 
 
//发送消息
function sendMsg() {
var inpt = document.getElementById('txtInput');
var str = inpt.value;
if(str.length==0){
inpt.className="error";
alert("请输入发送的消息内容");
return false;
}
inpt.className = "";
 
msgbox(str,localStorage.name);
//发送消息至服务器的Scoket。
socket.emit('msg', {
msg : str,
name:localStorage.name
});
console.log('[client]' + str);
inpt.value = "";
inpt.focus();
}
 
window.onload = function(){
document.body.onkeypress = function(event){
var e = window.event || event;
if(e.keyCode==13){
sendMsg();
}
}
}
</script>
</head>
<body>
<h2>简单的聊天室</h2>
<hr/>
<div id='box' ></div>
<input type='text' placeholder="请输入内容" id='txtInput' >
<input type='button' class="button orange" value='发送' onkeypress="sendMsg()" onclick='sendMsg();'>
</body>
</html>