javascript 如何使一个数组的图像得到的输入字段和显示的数组图像作为滑块

6yjfywim 于 2023-06-04 发布在 Java

关注(0)|答案(1)|浏览(166)

我的问题是使数组的图像输入字段和显示数组图像作为滑块在JavaScript任何人都可以解决它请回答我
请给予JavaScript代码

document.querySelector("#a").addEventListener("change", function(){
           const reader = new FileReader();
              reader.addEventListener("load", ()=>{
                   localStorage.setItem("recent-image", reader.result)
              });
           reader.readAsDataURL(this.files[0]);
    });
    document.addEventListener("DOMContentLoaded()", ()=> {
        
        const imageurl = localStorage.getItem("recent-image");

        if(imageurl){
            document.querySelector("#b").setAttribute("src", imageurl);
        }
    });

你能在数组中做这个吗请回答我
它只需要一个图像图像，但是，我想通过数组将多个图像存储在本地存储中，请回答我

JavaScript

来源：https://stackoverflow.com/questions/76384723/how-to-make-an-array-of-images-getting-by-input-field-and-display-the-array-imag

1条答案

按热度按时间

hyrbngr71#

我看到的问题是定义你的本地存储，并确保图像存储在其中，以便以后遍历它们中的每一个，我留下一个如何解决它的例子

var images = localStorage.getItem('images') || [];

function saveImages() {
    localStorage.setItem('images', JSON.stringify(images));
}

function drawImages() {
    var slider = document.getElementById('slider');
    slider.innerHTML = '';
    for (var i = 0; i < images.length; i++) {
        const img = images[i];
        const html_img = document.createElement('img');
        html_img.src = img;
        html_img.alt = 'Alt img';
        html_img.width = 200;
        html_img.height = 150;
        slider.appendChild(html_img);
    }
}

document.querySelector("#a").addEventListener("change", function(){
    const reader = new FileReader();
    reader.addEventListener("load", ()=>{
        images.push(reader.result);
        drawImages();
    });
    reader.readAsDataURL(this.files[0]);
});

document.addEventListener("DOMContentLoaded()", drawImages);

赞(0）回复(0）举报 2023-06-04

我来回答

javascript 如何使一个数组的图像得到的输入字段和显示的数组图像作为滑块

1条答案

相关问题

热门标签

最新问答