Um código de visualização encontrado na Internet para visualizar o arquivo antes de fazer o upload, reproduzido a partir de imagens JavaScript antes de fazer o upload (compatível com todos os navegadores)
<! Doctype html> <html> <head> <meta http-equiv = "content-type" content = "text/html; charset = utf-8"/> <style type = "text/css"> #preview, .img, img {width: 200px; Altura: 200px; } #preview {borda: 1px Solid #000; } </style> </ad Head> <body> <div id = "visualize"> </div> <input type = "file" onchange = "visualize (this)"/> <script type = "text/javascript"> function visualize (file) {var prevDiv = document.getElementById ('visualização'); if (file.files && file.files [0]) {var reader = new FileReader (); leitor.onload = function (evt) {prevdiv.innerhtml = '<img src = "' + evt.target.result + '" />'; } reader.readasDataurl (file.files [0]); } else {prevdiv.innerhtml = '<div style = "filtro: progid: dximageTransform.microsoft.alphaimageloader (sizingmethod = escala, src =/' ' + file.value +'/'"> </div>';}} </script>Pontos -chave de implementação
● Para Chrome, Firefox e IE10, use o FileReader para implementá -lo.
● Para o IE6 ~ 9, use filtro de filtro: progid: dximageTransform.microsoft.alphaimageloader para implementá -lo.
Eu testei o IE8+ sem problemas. No entanto, a linha de divisão do caminho do arquivo do arquivo.Value no IE7 foi removida pelo navegador e a linha de divisão do caminho do arquivo não foi exibida
O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.