Este artículo describe el método para cargar la vista previa de la imagen por JS. Compártelo para su referencia. El método de implementación específico es el siguiente:
Copie el código de la siguiente manera: Function PreviewImage (IMGFILE)
{
var fileextension = imgfile.value.substring (imgfile.value.lastIndexOf ("."), imgfile.value.length);
fileExtension = fileExtension.tOlowerCase ();
If ((fileExtension! = '. Jpg') && (fileExtension! = '. Gif') && (fileextension! = '. Jpeg') && (fileExtension! = '. Png') && (fileExtension! = '. Bmp')
{
alerta ("Lo siento, el sistema solo admite fotos en formatos estándar. Por favor, ajuste el formato y vuelva a subirlo, ¡gracias!");
imgfile.focus ();
}
demás
{
ruta var;
if (document.all) // es decir
{
imgfile.select ();
ruta = document.selection.createrGe (). Text;
document.getElementById ("imgpreview"). innerhtml = "";
document.getElementById ("imgpreview"). style.filter = "progid: dximagetransform.microsoft.alphaimageloader (habilitado = 'true', dimingmethod = 'escala', src =/" " + ruta +"/")"; // Use el efecto de filtro
}
más // ff
{
ruta = imgfile.files [0] .getAsdataurl ();
document.getElementById ("imgpreview"). innerhtml = "<img id = 'img1' width = '120px' height = '100px' src = '"+ruta+"'/>";
// document.getElementById ("IMG1"). Src = Path;
}
}
}
Llamado:
Copie el código de la siguiente manera: cargue la imagen: <input type = "file" name = "archivo"
estilo = "ancho: 200px; altura: 20px;" Onchange = "PreviewImage (this)" id = "cargar" />
<div id = "imgpreview">
</div>
El efecto de operación se muestra en la figura a continuación:
Espero que este artículo sea útil para la programación de JavaScript de todos.