1

tengo un problema con el siguiente código, lo que quiero hacer es que si la imagen es mayor de 3.67 MB, le de un aviso al usuario de que es muy grande, y que no seleccione la imagen, ya que cuando da la alerta al usuario la imagen sigue seleccionada.

<!DOCTYPE html>
<html lang="es-ar">
<head>
    <meta charset="utf-8" />
    <title>Tamaño archivo</title>
</head>
<body>
    <form action="#">
         <input type="file" id="archivos" accept="image/*" name="archivos[]"/>
    </form>
    <script>
        function archivoSeleccionado(evt) {
            if(window.File && window.FileReader && window.FileList && window.Blob){
                 var image = this.files[0].size;
                 if(image >= 3856819){
                       alert("La imagen es muy grande, El tamaño maximo es de 3.67 MB");
                 }else{
                       alert("La imagen tiene el tamaño adecuado");
                  }
            }

       }
       document.getElementById('archivos').addEventListener('change',    archivoSeleccionado, false);
    </script>
</body>
</html>
2

3 respuestas 3

1

La solución clásica es asignarle un string vacío al elemento:

if(image >= 3856819) {
  alert("La imagen es muy grande, El tamaño maximo es de 3.67 MB");
  this.value = '';
}

Sin embargo, ten en cuenta que si das soporte a IE <= 10 y versiones de Firefox <= 45, no puede serte de mucha ayuda ya que no funcionará. Una solución sencilla es clonar el elemento, asignarle el string vacío y reemplazarlo por el original:

if (file.size > 3856819) {
  var clone = this.cloneNode();
  clone.value = '';
  this.parentNode.replaceChild(clone, this);
}
1

Tama�o archivo function archivoSeleccionado(evt) { if(window.File && window.FileReader && window.FileList && window.Blob){ var image = this.files[0].size;

             if(image >= 3856819){
                   alert("La imagen es muy grande, El tama�o maximo es de 3.67 MB");
             }else{
                   alert("La imagen tiene el tama�o adecuado");
              }
        }

   }
   document.getElementById('archivos').addEventListener('change',    archivoSeleccionado, false);
    function limpiar(){
        input=document.getElementById("archivos");
        input.value = ''

input.type = '' input.type = 'file'

    }
</script>
<input type="button" onClick="limpiar()" value="Limpiar">

0

Esto te debe funcionar

if(image >= 3856819) {
  alert("La imagen es muy grande, El tamaño maximo es de 3.67 MB");
  var inputImage = document.getElementById("archivos");
  inputImage.value = '';
}
1
  • No es necesario obtener nuevamente el elemento; this referencia al elemento.
    – gugadev
    el 4 mar. 2017 a las 20:18

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.