<title>图片上传预览</title> <input type="file" id="fileElem" multiple accept="image/*" onchange="handleFiles(this)"> <div id="fileList" style="200px;height:200px;"></div> <script> window.URL = window.URL || window.webkitURL; var fileElem = document.getElementById("fileElem"), fileList = document.getElementById("fileList"); function handleFiles(obj) { var files = obj.files, img = new Image(); if(window.URL){ //File API //alert(files[0].name + "," + files[0].size + " bytes"); img.src = window.URL.createObjectURL(files[0]); //创建一个object URL,并不是你的本地路径 img.width = 200; img.onload = function(e) { window.URL.revokeObjectURL(this.src); //图片加载后,释放object URL } fileList.appendChild(img); }else if(window.FileReader){ //opera不支持createObjectURL/revokeObjectURL方法。我们用FileReader对象来处理 var reader = new FileReader(); reader.readAsDataURL(files[0]); reader.onload = function(e){ //alert(files[0].name + "," +e.total + " bytes"); img.src = this.result; img.width = 200; fileList.appendChild(img); } }else{ //ie obj.select(); obj.blur(); var nfile = document.selection.createRange().text; document.selection.empty(); img.src = nfile; img.width = 200; img.onload=function(){ // alert(nfile+","+img.fileSize + " bytes"); } fileList.appendChild(img); //fileList.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='image',src='"+nfile+"')"; } } </script>
使用smartUpload组件上传文件时的包:jsmartcom_zh_CN.jar