在jQuery中更新base64图像字符串时未进行图像刷新

Image refresh not happening when base64 image string updated in jQuery

本文关键字：图像 刷新 字符串 更新 base64 jQuery      更新时间：2024-02-25

上传新图像时，我希望配置文件图片图像更改为该新图像，而无需重新加载页面或在页面之间切换。我使用jQuery和AJAX get方法将图像的来源更改为base64编码的字符串。

显示配置文件图片jQuery功能-

$("img.profilepicture").each(function () {  
  var profileid = $("#profileid").val();
  var action = "image";
  var self = $(this);
  getprofileimage(profileid, action,self);
});
function getprofileimage(profileid,  action,  self) {
  $.ajax({
    type: "GET",
    url: "StoryServlet",
    data: {
      'action': action,
      'for': profileid,
      'timestamp': new Date().getTime()
    },
    processData: false,
    contentType: false,
    success: function (data) {
      self.attr('src',data.base64String);
      self.attr('title','profilepic');
    }
  });     
}

上传图像jQuery功能-

$("#uploadpic").click(function (e) {
  e.preventDefault();
  var fd = new FormData(document.querySelector("form"));
  $.ajax({
    type: "POST",
    url: "StoryServlet",
    data: fd,
    processData: false,
    contentType: false,
    success: function (data) {
      $("#picsucess").text(data.filename + " " + "uploaded sucessfully!");
      $("#picsucess").fadeIn();
      $("#picsucess").fadeOut(10000);
    }    
  }).done(function (data) {
     //done block
  }).fail(function (jqXHR, textStatus) {
    $("#fadein").text('File upload failed ...');
    $("#fadein").fadeIn();
    $("#fadein").fadeOut(10000);
  }).complete(function (jqXHR, textStatus) {
    location.reload();
  });       
});

删除

processData: false,
contentType: false,

在这种情况下，您需要处理传递给$.ajax的数据（显示配置文件图片功能），还需要为其设置内容类型，以便在服务器上正确读取
同时添加

 dataType: 'json',

为了安全。并确保您的响应是有效的json。

相关文章：