Javascript 如何仅为某些用户附加按钮-socket.io

我制作了一个基本的聊天程序，用户可以在其中创建聊天室。创建房间时，房间列表中将附加两个按钮：“连接”按钮和“删除”按钮。 但是，对于未创建文件室的用户，不应显示“删除按钮”，因为他们无法删除文件室。只有所有者（创建文件室的用户）才能删除文件室

反之亦然，对于房间的所有者，不应显示“加入按钮”，因为他们不必加入

下面你可以看到聊天程序的图片。我所指的按钮位于左侧。

---使用添加的代码更新： 如您所见，当客户端连接（服务器端）时，客户端自己的id通过函数“sendingOwnName”发出

在客户端（在代码的开头），该id被推入一个名为“currentUser”的数组中。更进一步，在“更新人员”中，我将currentUser与登录的新用户的id进行比较

其思想是，如果这两个id匹配，则对象的名称（新用户登录）不会添加到列表中。但是它不起作用

客户端：

$（文档）.ready（函数（）{
var socket=io.connect（“localhost:3000”）；
var$msg=$（“#msg”）；
变量$NamingRoom=$（“#NamingRoom”）；
var$房间=$（“#房间”）；
var$chat=$（“#chat”）；
var$people=$（“#people”）；
var类型=false；
var超时=未定义；
var currentUser=[]；
$（“#NewRoomWindow”）.hide（）；
$（“#主聊天屏幕”）.hide（）；
//梅尔德斯卡尔杰姆斯酒店
$（“#UsersOnlineAndRooms”）.hide（）；
$（“#msg”）.hide（）；
$（“#名称”）.focus（）；
$（“.chatToInfo”）.hide（）；
socket.on（“sendingOwnName”，函数（id）{
当前用户推送（id）；
})
$（“表格”）。提交（功能（事件）{
event.preventDefault（）；
});  
$（“#join”）.mousedown（函数（）{
var name=$（“#name”）.val（）；
如果（name.trim（）！=“”）{
socket.emit（“join”，name）；
$（“#登录”）.detach（）；
$（“#主聊天屏幕”）.show（）；
$（“#UsersOnlineAndRooms”）.show（）；
$rooms.show（）；
$（“#msg”）.show（）；
$（“#msg”）.focus（）；
$（“#房间”）.show（）；
$（“.chatToInfo”）.show（）；
就绪=正确；
$（“#msg”）.prop（“只读”，true）；
$（“#msg”）.attr（“占位符”，“开始对话或创建/加入聊天室”）；
$（“#发送”）.attr（“禁用”，真）；
}
}); 
$（“#名称”）。按键（功能（e）{
如果（e.which==13）{
var name=$（“#name”）.val（）；
如果（name.trim（）！=“”）{
socket.emit（“join”，name）；
$（“#登录”）.detach（）；
$（“#主聊天屏幕”）.show（）；
$（“#UsersOnlineAndRooms”）.show（）；
$rooms.show（）；
$（“#msg”）.show（）；
$（“#msg”）.focus（）；
$（“#房间”）.show（）；
$（“.chatToInfo”）.show（）；
就绪=正确；
$（“#msg”）.prop（“只读”，true）；
$（“#msg”）.attr（“占位符”，“开始对话或创建/加入聊天室”）；
$（“#发送”）.attr（“禁用”，真）；
}
}
});  
socket.on（“更新”，函数（newmsg）{
如果（准备就绪）
$chat.append（“+msg+”）；
}) 
socket.on（“updateToSelf”，函数（msg）{
$（“#聊天”）.append（“”+msg+“”）；
$（'#chat'）.scrollTop（$（'#chat'）[0]。scrollHeight）；
}); 
socket.on（“updateToOthers”，函数（msg）{
$（“#聊天”）.append（“”+msg+“”）；
$（'#chat'）.scrollTop（$（'#chat'）[0]。scrollHeight）；
}); 
socket.on（“更新人数”，函数（数据）{
$（“#peopleCount”）.empty（）；
$（“#peopleCount”）.append（“
”>People online“+data.count+”
”）；
});
socket.on（“更新人员”，函数（数据、id）{
$（“#人”）.empty（）；
$.each（data.people、function（a、obj、id）{
//if（当前用户[0]==对象id）{
if（当前用户[0]==对象id）{
返回；
}否则{
$（“#people”）.append（“
”；
}
});
});
//更新房间清单
socket.on（“roomList”，函数（数据）{
$（“#房间”）。文本（“”）；
$（“#房间”）.append（“
房间列表”+数据.count+“
”）；
如果（！jQuery.isEmptyObject（data.rooms））{
$。每个（数据室、功能（id、房间）{
var html=“加入”+“+”删除”+“+”离开”；
//var userButtons=“加入”+“+”离开”；
//var ownerButton=“删除”；
//var html=（room.owner==room.people？用户按钮：ownerButton）；
$（“#rooms”）.append（“
”+room.name+”+html+“
”）；
});
}否则{
$（“#房间”）。追加（“
”）没有可用的房间。
”；
$（“#msg”）.prop（“只读”，true）；
$（“#msg”）.attr（“占位符”，“开始对话或创建/加入聊天室”）；
$（“#发送”）.attr（“禁用”，真）；
}
});
//更新对话列表
socket.on（“更新对话”，函数（数据）{
$（“#对话”）.empty（）；
$（“#对话”）.append（“
conversations”+data.count+“
”）；
if（！jQuery.isEmptyObject（data.conversations））{
$。每个（data.conver）
{
  "RoomId1": {
    "name": "A Room Name"
    },
  "RoomId2": {
    "name": "An Other Room"
    }
}

{
  "RoomId1": {
    "name": "A Room Name",
    "ownerId": "user1"
    },
  "RoomId2": {
    "name": "An Other Room",
    "ownerId": "user2"
    }
}

//replace this line:
var html = "<button id="+id+" class='joinRoomBtn btn btn-default btn-xs' >Join</button>" + " " + "<button id="+id+" class='removeRoomBtn btn btn-default btn-xs'>Remove</button>";
//with those:
var joinButton = "<button id="+id+" class='joinRoomBtn btn btn-default btn-xs' >Join</button>";
var removeButton = "<button id="+id+" class='removeRoomBtn btn btn-default btn-xs'>Remove</button>"
//Here the userId must be define before, i don't know how you can get it.
var html = (room.ownerId === userId?" removeButton : joinButton);

//Updating room list
socket.on("roomList", function(data) {
  $("#rooms").text("");
  $("#rooms").append("<li class=\"list-group-item active\">List of rooms <span class=\"badge\">"+data.count+"</span></li>");

  if (!jQuery.isEmptyObject(data.rooms)) { 
    $.each(data.rooms, function(id, room) {
      var joinButton = "<button id="+id+" class='joinRoomBtn btn btn-default btn-xs' >Join</button>";
      var removeButton = "<button id="+id+" class='removeRoomBtn btn btn-default btn-xs'>Remove</button>";
      var html = (room.ownerId === userId?" removeButton : joinButton);
      $('#rooms').append("<li id="+id+" class=\"list-group-item\"><span>" + room.name + "</span> " + html + "</li>");
    });
  } else {
    $("#rooms").append("<li class=\"list-group-item\">There are no rooms.</li>");
    $("#msg").prop("readonly", true);
    $("#msg").attr("placeholder", "Join or create room to chat");
    $("#send").attr("disabled", true);
  }
});