带有 Socket IO 的点击事件答案

【问题标题】：Click events with Socket IO带有 Socket IO 的点击事件
【发布时间】：2014-09-22 16:50:17
【问题描述】：

我正在使用节点和 Socket IO 在一个浏览器中设置点击事件并在另一个浏览器中触发动画。我很难让这个工作。例如，单击一个浏览器中的按钮将隐藏另一个浏览器中的框。我到目前为止的代码是：

客户端：

    function hideBox(data) {
      $('.box').hide();
    };

    $('.btn').on('click', function(event) {
      socket.emit('hideBtn', {id: event.target});
    });

    socket.on('hideBtn', function(data) {
      $(data.id).hideBox;
    });

服务器端

socket.on('hideBtn', function(data) {
  socket.broadcast.emit('hideBtn', data);
});

任何帮助将不胜感激。谢谢。

【问题讨论】：

嗨拉维。没有错误，只是没有任何反应。我知道两个浏览器都已连接，因为我会在套接字连接上为每个浏览器发送警报。
console.log('something') 在.on('hideBtn', function(){}) 中并检查控制台中的问题所在。

标签： node.js websocket socket.io

【解决方案1】：

 socket.on('hideBtn', function(data) {
      $(data.id).hideBox;
    });

hideBox 是一个函数吗？也许是因为忘记了“()”:-)

【讨论】：

【解决方案2】：

好的，所以经过大量的来回折腾，答案实际上只需要简化代码。无需指定 event.target 等，只需简单地发出并监听事件即可。

客户端代码，index.html：

$('.btn').on('click', function() {
  socket.emit('hideBoxRequest');
});

服务器端代码：

socket.on('hideBoxRequest', function () {
  socket.broadcast.emit('hideBox');
});

最终代码客户端，用于我的另一个 html 文件：

socket.on('hideBox', function () {
    $('.testBox').fadeOut();
});

所以基本上点击 index.html 中的 btw 会向服务器发出“hideBoxRequest”。然后服务器将其拾取并向连接到服务器的所有客户端发送“hideBox”。

【讨论】：