Esto lo he implementado en javascript. Entonces, si el usuario carga una imagen, mostrará la imagen y también el nombre de la imagen. Así que aquí actualmente puedo cargar una sola imagen. Entonces, ¿cómo podemos cargar varias imágenes en este caso? Si alguien tiene una idea, hágamelo saber.
var loadFile = function(event) { var image = document.getElementById('output'); image.src = URL.createObjectURL(event.target.files[0]); } <input type="file" accept="image/*" name="image" id="file" onchange="loadFile(event)"> <img id="output" width="200" />Puede usar multiple atributos en input para aceptar varias imágenes y usar un bucle for para iterar sobre los archivos y mostrar cada uno de ellos.
var loadFile = function(event) { for (let i = 0; i < event.target.files.length; i++) { var image = document.createElement('img'); image.src = URL.createObjectURL(event.target.files[i]); image.id = "output"; image.width = "200"; document.querySelector(".cont").appendChild(image); } }; <p><input multiple type="file" accept="image/*" name="image" id="file" onchange="loadFile(event)" style=""></p> <p class="cont"></p>