如何附加聊天并在socket.io中显示井类?
我正在使用socket.io和nodejs构建一个聊天应用程序。我有这些问题 - 当我刷新页面时它添加了另一个连接的客户端 - 当我断开它时不切片 - 当我发送消息时它不会出现在div“井”中
我试图改变div'好'
/server.就是
var http = require('http');
var express = require('express'),
app = module.exports.app = express();
var server = http.createServer(app);
var io = require('socket.io').listen(server); //pass a http.Server instance
//now you can use app and io
users=[];
connections = [];
//server.listen(process.env.PORT || 3000); // this is another way of port listen
console.log('Server running...');
app.get('/', function (req, res){
res.sendFile(__dirname + '/index.html');
});
//create connections
io.on('connection', function(socket){
connections.push(socket);
console.log('connected: %s sockets connected', connections.length);
//disconnect /////////////////////// doesn't work ////////////////////////////
io.on('disconnection', function(data){
connections.slice(connections.indexOf(socket), 1);
console.log('disconnected: %s sockets connected', connections.length);
});
// send message
socket.on('send message', function (data){
console.log(data);
io.sockets.emit('new message', {msg: data});
});
});
server.listen(80); //listen on port 80
/client.HTML
<div class="container">
<div class="row">
<div class="col-md-4">
<div class="well">
<h3>Online Users</h3>
<ul class="list-group" id="users">
</ul>
</div>
</div>
<div class="col-md-8">
<div class="chat" id="chat">
</div>
<form id="messageForm" action="index.html" method="post">
<div class="form-group">
<label> Enter Message</label>
<textarea class="form-control" id="message" name="name" rows="8" cols="80"></textarea>
<br >
<input type="submit" class="btn btn-primary" name="" value="Send Message" />
</div>
</form>
</div>
</div>
</div>
/ client js
<script src="/socket.io/socket.io.js"></script>
<script>
$(function(){
var socket = io.connect();
var $messageForm = $('#messageForm');
var $message = $('#message');
var $chat = $('#char');
$messageForm.submit(function (e) {
e.preventDefault();
console.log('submitted');
socket.emit('send message', $message.val());
$message.val('');
});
socket.on('new message', function(data){
// $chat.append('<div class="well">' +data.msg+ '</div>');
$chat.append('<ul class="list-group" id="users">' +data.msg+ '</ul>');
});
});
</script>
我只想聊天.append();上班。
回答如下:问题出在这里
var $chat = $('#char');
你的代码没有id为char
的div。您已经提到过该消息应该附加在div well
中,以便您可以使用
var $chat = $('#well');
或者有一个id为chat
的div
var $chat = $('#chat');