“Cómo mostrar una vista previa de imagen múltiple en jQuery” Código de respuesta

Cómo mostrar una vista previa de imagen múltiple en jQuery

function previewImages() {

  var preview = document.querySelector('#preview');
  
  if (this.files) {
    [].forEach.call(this.files, readAndPreview);
  }

  function readAndPreview(file) {

    // Make sure `file.name` matches our extensions criteria
    if (!/\.(jpe?g|png|gif)$/i.test(file.name)) {
      return alert(file.name + " is not an image");
    } // else...
    
    var reader = new FileReader();
    
    reader.addEventListener("load", function() {
      var image = new Image();
      image.height = 100;
      image.title  = file.name;
      image.src    = this.result;
      preview.appendChild(image);
    });
    
    reader.readAsDataURL(file);
    
  }

}

document.querySelector('#file-input').addEventListener("change", previewImages);
Shiny Swiftlet

Cómo mostrar una vista previa de imagen múltiple en jQuery

<input id="file-input" type="file" multiple>
<div id="preview"></div>
Shiny Swiftlet

Respuestas similares a “Cómo mostrar una vista previa de imagen múltiple en jQuery”

Preguntas similares a “Cómo mostrar una vista previa de imagen múltiple en jQuery”

Más respuestas relacionadas con “Cómo mostrar una vista previa de imagen múltiple en jQuery” en JavaScript

Explore las respuestas de código populares por idioma

Explorar otros lenguajes de código