带有Node.js，jQuery的Socket.IO和Complex JSON
我遇到了很多麻烦。 我试图让它成为当我移动一个square-div时，该div的位置通过Socket.IO传递到另一个页面，以便div实时移动。 唯一的问题是我不知道如何做到这一点！ http://socket.io上的文档只让我困惑。
我的jQuery代码：
$(document).ready(function() { $("#mydiv").draggable().mousemove(function(){ var coord = $(this).position(); $("#left").val(coord.left); $("#top").val(coord.top); }); }); HTML：
X: Y:
我甚至不知道从哪里开始socket.io，请帮忙！
非常感谢你！
Socket.IO由两部分组成：
- 可以从客户端发送和接收数据的服务器程序
- 一个客户端脚本，可以连接到Socket.IO服务器并发送和接收数据
所以，首先，你需要一台服务器。 这是一个侦听端口8080并且当客户端连接时，它等待来自它的receive_position事件，当它获得一个时，它通过update_position事件将该位置广播到所有其他连接的客户端。
当访问根URL（ / ）时，还有一些代码用于提供index.htm文件。 大部分代码来自Socket.IO“如何使用”页面; 如果nonSocket.IO代码没有任何意义，你可能想要了解你的Node.js基础知识。
var app = require('http').createServer(handler) , io = require('socket.io').listen(app) , fs = require('fs') app.listen(8080); function handler (req, res) { fs.readFile(__dirname + '/index.html', function (err, data) { if (err) { res.writeHead(500); return res.end('Error loading index.html'); } res.writeHead(200); res.end(data); }); } var lastPosition = { x: 0, y: 0 }; // whatever default data io.sockets.on('connection', function (socket) { socket.emit('update_position', lastPosition); socket.on('receive_position', function (data) { lastPosition = data; socket.broadcast.emit('update_position', data); // send `data` to all other clients }); });
现在您的服务器已经设置好了，您需要一些客户端脚本来发送和接收div的位置。 将此代码放在index.htm文件中。
拖动div时，此代码发送receive_position事件; 服务器获取此事件，并将具有相同x和y值的update_position事件发送给所有其他客户端; 当他们收到这些数据时，他们会更新div。
希望这有助于您入门; 如果您有任何疑问，请在评论中告诉我。