如何在 socket.io 事件设置后更改图像 src?
How to change image src after set by socket.io event?
使用 socket.io,我使用 base64
编码字符串将图像从服务器推送到客户端:
socket.on('send_picture', function (data){
socket_data = (socket_data + data);
document.getElementById('imgid').src = socket_data
})
如何在下一个 socket.io 事件中重置 'imgid'
的 src?它有一次工作正常,但在我刷新页面之前不会显示新图像
我发现加载新图像内容的最可靠方法是每次都创建一个新图像元素并用新图像对象替换之前的图像对象。你可以这样做:
socket.on('send_picture', function (data){
socket_data = socket_data + data;
var oldImg = document.getElementById('imgid');
var newImg = new Image();
newImg.src = socket_data;
newImg.id = 'imgid';
oldImg.parentNode.replaceChild(newImg, oldImg);
});
使用 socket.io,我使用 base64
编码字符串将图像从服务器推送到客户端:
socket.on('send_picture', function (data){
socket_data = (socket_data + data);
document.getElementById('imgid').src = socket_data
})
如何在下一个 socket.io 事件中重置 'imgid'
的 src?它有一次工作正常,但在我刷新页面之前不会显示新图像
我发现加载新图像内容的最可靠方法是每次都创建一个新图像元素并用新图像对象替换之前的图像对象。你可以这样做:
socket.on('send_picture', function (data){
socket_data = socket_data + data;
var oldImg = document.getElementById('imgid');
var newImg = new Image();
newImg.src = socket_data;
newImg.id = 'imgid';
oldImg.parentNode.replaceChild(newImg, oldImg);
});