- <html>
- <head>
- <title>
www.jb51.NET 图片上传预览
- </title>
- <script>
- function PreviewImage(imgFile) {
- var pattern = /(\.*.jpg$)|(\.*.PNG$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/;
- if (!pattern.test(imgFile.value)) {
- alert("系统仅支持 jpg/jpeg/png/gif/bmp 格式的照片!");
- imgFile.focus()
- } else {
- var path;
- if (document.all) {
- imgFile.select();
- path = document.selection.createRange().text;
- document.getElementById("imgPreview").innerHTML = "";
- document.getElementById("imgPreview").style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='scale',src=\"" + path + "\")"
- } else {
- path = URL.createObjectURL(imgFile.files[0]);
- document.getElementById("imgPreview").innerHTML = "<img src='" + path + "'/>"
- }
- }
- }
- </script>
- </head>
- <body>
- <div>
- <input type="file" onchange='PreviewImage(this)' />
- <div id="imgPreview" style='width: 500px; height: 400px;'>
- <img src="" />
- </div>
- </div>
- </body>
- </HTML>
来源: http://www.bubuko.com/infodetail-2991701.html