Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

186
Vistas
Cómo agregar el botón Eliminar que elimina la entrada de imagen real y su miniatura de vista previa (JS)

Tengo una entrada de archivo de imagen múltiple. Hay una miniatura de vista previa para cada archivo seleccionado con el icono de eliminación de miniatura. Pero este ícono elimina solo la miniatura. Necesito este ícono para eliminar la vista previa en miniatura y una imagen cargada real. Por favor, ayúdame a hacerlo. ¡¡Gracias de antemano!!

 window.onload = function() { //Check File API support if (window.File && window.FileList && window.FileReader) { var filesInput = document.getElementById("files"); filesInput.addEventListener("change", function(event) { var files = event.target.files; //FileList object var output = document.getElementById("result"); for (var i = 0; i < files.length; i++) { var file = files[i]; //Only pics if (!file.type.match('image')) continue; var picReader = new FileReader(); picReader.addEventListener("load", function(event) { var picFile = event.target; var div = document.createElement("div"); div.innerHTML = "<img class='thumbnail' src='" + picFile.result + "'" + "title='" + picFile.name + "'/> <a class='remove_pict'>X</a>"; output.insertBefore(div, null); div.children[1].addEventListener("click", function(event) { div.parentNode.removeChild(div); }); }); //Read the image picReader.readAsDataURL(file); } }); } else { console.log("Your browser does not support File API"); } }
 <form> <article> <label for="files" class="upload_multiple_photos">Select files...</label> <input id="files" type="file" name="my-file" value="" accept="image/png, image/gif, image/jpeg" multiple/> <output id="result" /> </article> <input id="submit" type="submit" value="Submit"> </form>

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda