Question

如果我这样做，我有一个正常的div：

$('#chat').innerHTML(data.sticker);

使用上面的代码，会发生什么，它取代了我以前的贴纸，但我不想让我以前的贴纸消失。

因此，我这样做：

$('#chat').append(data.sticker);

以上代码的作用是......它复制了我的数据。举个例子，如果我点击我的＆＃34; Sticker 1＆＃34;然后贴纸1显示，当我再次点击它时第二次＆＃34;贴纸1＆＃34;显示3次... 1是前一个，2是新的，然后如果我第三次点击它，它显示6个stchokers ... 3是前一个，3个是新的。任何人都可以帮忙吗？

我的index.html：

＆＃13;

function which_sticker(image){
  var clickedElement;
  var $chat = $('#chat');
  var socket = io.connect();
  if(image=='1'){
    clickedElement = '<img src="stickers/angry/1.png" height="90" width="90"/>';
  }
  console.log(clickedElement);
  socket.emit('send sticker', clickedElement);

  socket.on('get sticker', function(data){
    console.log(data.sticker);
    $('#chat').append('<span class="msg"><b><span id="name_title">' + data.nick + '</span></b><br />' + data.sticker + '<br>');
  });
}

＆＃13;

<img src="stickers/angry/1.png" onClick="which_sticker('1');" height="90" width="90"/>

＆＃13;

Answer 1

这种情况正在发生，因为每当用户点击元素时，你就会在套接字上一次又一次地为getsticker分配事件，所以每当你点击事件多次注册，所以第一次它有一个注册函数第二次两次，并且随后

在这里，您需要清除事件监听器或，只需在页面的一段时间内注册一次....我已经在下面给出了第二个示例。我已将事件注册码移出click事件处理程序

var socket = io.connect();

socket.on('get sticker', function(data){
  console.log(data.sticker);
  $('#chat').append('<span class="msg"><b><span id="name_title">' + data.nick + '</span></b><br />' + data.sticker + '<br>');
});

function which_sticker(image){
  var clickedElement;
  var $chat = $('#chat');

  if(image=='1'){
    clickedElement = '<img src="stickers/angry/1.png" height="90" width="90"/>';
  }
  console.log(clickedElement);
  socket.emit('send sticker', clickedElement);
}

DOM在使用append时复制内容

1 个答案: