• 如何在页面预览客户端本地图片 兼容FF IE


    IE为了安全是不允许页面预览客户端本地图片的,也就是img元素的SRC是相对路径 不可能是绝对路径的

    为了达成这一需求 需要使用滤镜

    公司最近有个项目有这样的需求我才发现我之前写的 如何通过JS获取用户本地图片路径 这篇文章里所使用的方法只支持本地页面预览本地图片
    有一种解决方法是上传到服务器后返回相对路径 但是效率是个问题,编程复杂度也会提高
    直接上demo代码 为更多有这种需求又苦于找不到解决方案的同行提供源码 转载请注明出处 我这里还有更多的其他问题的解决方案供更多人参考
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
        <title>get file input full path</title>
        <script type="text/javascript" language='javascript'>
            function getFullPath(obj) {
                var newPreview = document.getElementById("img");
                if (obj) {
                    //ie 
                    if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
                        obj.select();
                        newPreview.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);";
                        newPreview.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.selection.createRange().text;
    
                        return;
                    }
                    //firefox 
                    else if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
                        if (obj.files) {
                            newPreview.src = window.URL.createObjectURL(obj.files.item(0));
    
                            return;
                        }
                        newPreview.src = obj.value;
    
                        return;
                    }
                    newPreview.src = obj.value;
    
                    return;
                }
            }
        </script>
    </head>
    <body>
        <input type="file" onchange="getFullPath(this);" />
        <img id="img" alt="" style="200px; height:200px;" src="你自己的透明图片"/>
    </body>
    </html>
  • 相关阅读:
    timeit模块
    python中的del
    python的默认参数
    python3中的nonlocal 与 global
    python通俗讲解闭包
    vlc 视频播放器的快捷键
    Python的重要知识点汇总3
    Python的重要知识点汇总2
    Python的重要知识点汇总1
    01玩转数据结构_08_堆和优先队列
  • 原文地址:https://www.cnblogs.com/ahjesus/p/2510883.html
Copyright © 2020-2023  润新知