时间戳

首页 > 解决方案 > 替换数组中 1 个位置的选择图像

javascript - 替换数组中 1 个位置的选择图像

问题描述

我有图像数组。 在此处输入图像描述

我想通过单击将所选图像移动到数组中的第一个位置 在此处输入图像描述

在此处输入图像描述

$(document).on('click', '.newProductPic', function () {

$(".newProductPic").removeClass("selectImage");

$(this).addClass("selectImage");

var image = $(".selectImage")[0];
var fReader = new FileReader();

fReader.onloadend = (function (f) {
    return function (e) {

        var base64ImageString = this.result;
        var imageName = f.name;
        imagesListContent.push({ base64ImageString, imageName });

        addThumbMainImage(base64ImageString, f.name);
        currentMainImage = 'newProductPic' + i + '';
    };
})(image);

fReader.readAsDataURL(image);
var temp = $(".newProductPic")[0];

imagesListContent[0] = imagesListContent[selectMainImageId];

imagesListContent[selectMainImageId] = temp;
});

我遇到了一个错误：未捕获的 TypeError：无法在“FileReader”上执行“readAsDataURL”：参数 1 不是“Blob”类型。我做错了什么，这个问题的解决方案是什么？

标签： javascriptbase64filereader

解决方案

您提供给 readAsDataURL 的参数应该是文件引用而不是 jquery 对象。

<input type="file" id="files">


document.getElementById('files').addEventListener('change', handleFileSelect, fals)

该函数将接收事件作为参数，您可以通过event.currentTarget.files. 这是一个数组

另一种方法是从输入元素的文件数组中获取文件引用。

https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL

推荐阅读