Question

我正在为公司控制面板制作管理功能。我正在尝试创建的小部件是管理员用控制面板上的默认徽标替换自己的公司徽标。

我使用localStorage进行概念验证，但它将在生产时保存到数据库和CMS中。

我已经掌握了上传新图片/徽标和更换默认设置的基础知识。但是，我们正在使用＆＃34; out of box＆＃34;预先播种控制面板标题。默认徽标。出于某种原因，首次加载页面时，默认徽标不会显示。您目前获得了损坏的图片图标。上传新图像后，它会替换标题徽标并将当前选择保留在管理窗口小部件中。

如果您刷新页面，它会从localStorage中调用它，这样可以正常工作但如果您重置，您会注意到没有出现预先播种的徽标。

var img = new Image();
img.src = localStorage.theImage;

$('.logoArea').html(img);
$("body").on("change", ".uploadLogo", function() {
    var fileInput = $(this)[0];
    var file = fileInput.files[0];

    var reader = new FileReader();
    reader.onload = function(e) {
        // CREATE A NEW IMAGE
        var img = new Image();

        img.src = reader.result;
        localStorage.theImage = reader.result; // STORE IMAGE IN LOCAL STORAGE
        $(".logoArea").html(img);
    }
    reader.readAsDataURL(file);
});

不确定我哪里出错了。请参阅工作模型小提琴

更新：这已经解决了，我将下面的小提示更新为工作版本，以防其他人帮忙。

https://jsfiddle.net/evmcatj1/7/

Answer 1

在第一次加载localStorage.theImage;为undefined时，您应该使用默认图片，以防用户第一次打开页面

使用localStorage的jQuery图像上传器。部分工作。默认图片未显示

1 个答案: