如何防止使用jquery和socket.io添加多個事件偵聽器

Question

我有一個在$（'。message-input'）上設置偵聽器的函數

function addEasterEgg(room){
  $('.message-input').on('focus', function(event) {
    event.preventDefault();
    console.log('room', room)
    if (room.length === 1) {
      displayStatus("No-one's there!!")
    };
  });
}

在事件roomStatus上調用它。

socket.on('roomStatus', function(room){
  addEasterEgg(room);
});

每當有人加入房間時，都會觸發roomStatus事件。 因此，如果會議室首先有1個人，則會觸發該會議室，並且room = [“ Zf17x3UsNUdgMJ3UAAAD”]，然后當另一個人加入時，它會再次觸發，並且會議室= [“ Zf17x3UsNUdgMJ3UAAAD”，“ ksxzbQhe0GuZqhMyAAAE”]

因此，在“焦點”事件上，我得到了兩個console.logs（每個房間值一個）和room.length始終等於1，即使此后變為2

我相信這是因為我的方法被調用了兩次，意味着添加了2個偵聽器。 如果是正確的話，當下一次調用roomStatus並調用addEasterEgg時，我應如何設法刪除上一個偵聽器？

謝謝

Answer 1

我找到了解決方法。 看起來確實確實向其中添加了多個事件偵聽器

$('.message-input')

因此，在添加固定的事件之前，只需刪除所有剩余的事件偵聽器即可

$('.message-input').off('focus')

添加到：

function addEasterEgg(room){
  $('.message-input').on('focus', function(event) {
    event.preventDefault();
    console.log('room', room)
    if (room.length === 1) {
      displayStatus("No-one's there!!")
    };
  });
}