使用 Node.js 和 Socket.IO 单击时的 jQuery 函数
Posted
技术标签:
【中文标题】使用 Node.js 和 Socket.IO 单击时的 jQuery 函数【英文标题】:jQuery function on click with Node.js and Socket.IO 【发布时间】:2015-08-02 15:00:27 【问题描述】:我按照推荐创建了一个简单的聊天应用程序(效果很好),但我无法弄清楚如何使用 Socket.IO 跨网络套接字启动 jQuery 函数。
例如,我有一个按钮可以点击:
<button id="button">
Click me!
</button>
我希望我的按钮在被点击时执行一个功能:
$("button").click(function()
doSomething();
);
这是我在客户端拥有的示例
var socket = io.connect('http://localhost:3000');
function doSomething()
$('body').css(
background: "red"
);
这是我在服务器端的内容(我的 server.js 文件) - 我认为这可能是导致问题的一部分:
var io = require('socket.io'),
connect = require ('connect');
var app = connect().use(connect.static('public')).listen(3000);
var commands = io.listen(app);
commands.sockets.on('connection', function (socket)
// Possibly insert handler here?
);
以防万一我不清楚目的 - 我希望在单击按钮时让所有连接的客户端的主体背景变为红色。
【问题讨论】:
【参考方案1】:您必须首先在单击按钮时向您的 node.js/socket.io-server 发出事件。然后在服务器端,您必须向所有客户端发出。在客户端,您必须侦听该服务器端事件。而且你的服务器看起来不太好。
试试这样的例子:
"use strict";
var server = require('http').createServer();
var io = require('socket.io')(server);
io.on('connection', function (socket)
//senden an socket dass er verbunden ist
//socket.emit('userOnline', message: 'verbunden');
//Informationen vom User holen
socket.on('changeBgColor', function (color)
console.log(color);
socket.broadcast.emit('changeBgColorEveryWhere', color.color);
socket.emit('changeBgColorEveryWhere', color.color);
);
);
server.listen('3000');
例如在客户端:
<!doctype html>
<html>
<head>
<title>test</title>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="http://localhost:3000/socket.io/socket.io.js"></script>
<script type="text/javascript">
var socket = io('ws://localhost:3000/');
$(document).off('click', '#button').on('click', '#button', function (e)
console.log('click');
socket.emit('changeBgColor', color: 'red');
e.preventDefault();
);
socket.on('changeBgColorEveryWhere', function (color)
console.log(color);
$('body').css('background', color);
);
</script>
<button id="button">Button</button>
</body>
</html>
【讨论】:
当我尝试这个时,页面根本无法加载,即使服务器正在运行。 @DRBC 查看我的更新答案。我在本地机器上对此进行了测试,效果很好。以上是关于使用 Node.js 和 Socket.IO 单击时的 jQuery 函数的主要内容,如果未能解决你的问题,请参考以下文章
如何将 Asterisk ARI 与 socket.io 和 Node.js 一起使用