【图片预览】--- >ie6

1.╮(╯_╰)╭没能完成想要的任务

2.预览ie10及以上图片为base64形式，ie9及以下为滤镜filter形式出现，都完成限制文件类型及大小。

3.实现代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script type="text/javascript" src="js/jquery-1.11.3.min.js" ></script>
    <style type="text/css">
        .imgshow{margin:0 auto;width: 20%;}
         #preview,.img,img {width: 256px;height: 256px;}   
    </style>
</head>
<body>
    <input type="file" id="imgfile"  accept=".png,.jpg,.jpeg" onchange="preview(this)" >
    <div class="imgshow">
        <center id="preview"></center>
    </div>

    <script type="text/javascript">
    function preview(file) {
        var filepath = file.value; 
        var fileSize = 0;
        var filemaxsize = 1024;
        var suffix = filepath.substring(filepath.lastIndexOf(".") + 1).toLowerCase();
            if (suffix != "jpg" && suffix != "png" && suffix != "bmp" && suffix != "jpeg") {
                alert("请选择jpg、png、bmp、jpeg文件");
                return;
            }
        var isIE = /msie/i.test(navigator.userAgent) && !window.opera; 
        if (isIE && !file.files) { 
            var filePath = file.value; 
            var fileSystem = new ActiveXObject("Scripting.FileSystemObject"); 
        if(!fileSystem.FileExists(filePath)){ 
            alert("附件不存在，请重新输入！"); 
            return false; 
        } 
        var fileModel = fileSystem.GetFile (filePath);  
            fileSize = fileModel.Size; 
        }else { 
            fileSize = file.files[0].size; 
        }

        var size = fileSize / 1024; 
        if(size>filemaxsize){ 
            alert("附件大小不能大于"+filemaxsize/1024+"M！"); 
            file.value =""; 
            return false; 
        } 

        var prevDiv = document.getElementById('preview');

        if (file.files && file.files[0]) {
            var reader = new FileReader();
            reader.onload = function(evt) {
                prevDiv.innerHTML = '<img id="imgshow" src="' + evt.target.result + '"/>';
            }
            reader.readAsDataURL(file.files[0]);
        } else {
            prevDiv.innerHTML = '<div class="img" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src=\'' + file.value + '\'"></div>';
        }
    }
    </script>
</body>
</html>
View Code

总结：了解base64兼容，ie6/7/8/9不兼容

4.有些资料

 (1)保留未测，兼容ie6\7\8\9方式→这里

posted on 2017-07-12 14:27  Nyah  阅读(132)  评论(0)    收藏  举报