• 使用a链接下载图片


    在做a链接下载图片的时候遇到一个问题,在谷歌浏览器下只是新建了一个窗口,并没有实现下载。浏览器版本信息

    经过实测,在谷歌下a链接实现下载图片必须具备两个条件。1,必须在启动服务,在服务器下运行。2,必须使用相对路径。

    下面附上兼容写法代码:

    <ul>
        <li><span>本人照片:</span><img src="0.JPG" alt=""><a href="javascript:void(0);" onclick="down_img(this)">点击下载</a>
            </li>
        <li><span>护照首页:</span><img src="1.jpg"alt=""><a href="javascript:void(0);" onclick="down_img(this)">点击下载</a>
            </li>
    </ul>
        
    function myBrowser() {
                var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
                var isOpera = userAgent.indexOf("Opera") > -1;
                if (isOpera) {
                    return "Opera"
                }; //判断是否Opera浏览器
                if (userAgent.indexOf("Firefox") > -1) {
                    return "FF";
                } //判断是否Firefox浏览器
                if (userAgent.indexOf("Chrome") > -1) {
                    return "Chrome";
                }
                if (userAgent.indexOf("Safari") > -1) {
                    return "Safari";
                } //判断是否Safari浏览器
                if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
                    return "IE";
                }; //判断是否IE浏览器
                if (userAgent.indexOf("Trident") > -1) {
                    return "Edge";
                } //判断是否Edge浏览器
            }
    
        //②IE浏览器图片保存(IE其实用的就是window.open)
        function SaveAs5(imgURL) {
            var oPop = window.open(imgURL, "", "width=1, height=1, top=5000, left=5000");
            for (; oPop.document.readyState != "complete";) {
                if (oPop.document.readyState == "complete") break;
            }
            oPop.document.execCommand("SaveAs");
            oPop.close();
        }
    
        //④点击事件下载(只需更改图片路径即可)
        function down_img(a) {
            var osb = a;
            var sb = a.previousSibling.src;
            // console.log(sb)
            if (myBrowser() === "IE" || myBrowser() === "Edge") {
                //IE (浏览器)
                SaveAs5(sb);
            } else {
                //!IE (非IE)
                osb.href = sb;
                osb.download = "";
            }
        }

      

  • 相关阅读:
    ASP.NET——基础 14、Server
    ASP.NET——基础 15、HttpHandler
    ASP.NET——基础 2、ViewState
    MYSQL VS2010 中文乱码问题
    ASP.NET——基础 10、Web开发的一些基本原则1
    数据结构与算法 2、单向/双向链表
    C#操作XML日志
    web开发入门级学习经验(菜鸟级)
    笔记:键盘键值一览表(JS)
    笔记:JS事件的捕获与冒泡
  • 原文地址:https://www.cnblogs.com/jxl-blog/p/9791183.html
Copyright © 2020-2023  润新知