> 웹 프론트엔드 > JS 튜토리얼 > js를 사용하여 이미지를 로컬로 다운로드하는 방법

js를 사용하여 이미지를 로컬로 다운로드하는 방법

墨辰丷
풀어 주다: 2018-05-09 15:46:47
원래의
5848명이 탐색했습니다.

이 글에서는 js를 통해 이미지를 로컬로 다운로드하는 코드를 주로 소개합니다. 관심 있는 친구들이 참고할 수 있습니다.

코드는 다음과 같습니다.

$(function(){  
    //二维码  
    (function(){  
        var img_src = $('.qr_img')[0].src;  
        if(browserIsIe()){//假如是ie浏览器  
            $('.down_qr').on('click',function(){  
                img_src = $('.qr_img')[0].src;  
                DownLoadReportIMG(img_src);  
            });  
        }else{  
            $('.down_qr').attr('download',img_src);  
            $('.down_qr').attr('href',img_src);  
  
            $('.sutmit_btn').on('click',function(){  
                $('.down_qr').attr('download',img_src);  
                $('.down_qr').attr('href',img_src);  
            });  
        }  
          
    })();  
});  
  
function DownLoadReportIMG(imgPathURL) {  
    //如果隐藏IFRAME不存在,则添加  
    if (!document.getElementById("IframeReportImg"))  
        $(&#39;<iframe style="display:none;" id="IframeReportImg" name="IframeReportImg" onload="DoSaveAsIMG();" width="0" height="0" src="about:blank"></iframe>&#39;).appendTo("body");  
    if (document.all.IframeReportImg.src != imgPathURL) {  
        //加载图片  
        document.all.IframeReportImg.src = imgPathURL;  
    }  
    else {  
        //图片直接另存为  
        DoSaveAsIMG();  
    }  
}  
function DoSaveAsIMG() {  
    if (document.all.IframeReportImg.src != "about:blank")  
        window.frames["IframeReportImg"].document.execCommand("SaveAs");  
}  
//判断是否为ie浏览器  
function browserIsIe() {  
    if (!!window.ActiveXObject || "ActiveXObject" in window)  
        return true;  
    else  
        return false;  
}
로그인 후 복사

요약:

javascript에는 로컬 파일을 작동할 수 있는 권한이 없습니다. .net과 같은 백엔드 언어의 도움을 받아야만 가능합니다. php 등 이미지를 제출하면 다운로드 주소가 반환되고, window.open이 자동으로 다운로드됩니다.

관련 권장 사항:

node.js로 이미지를 다운로드하는 두 가지 방법

js 다운로드 및 파일 이름 변경을 위한 예제 튜토리얼

javascript - js를 사용하여 웹 페이지를 다운로드하시겠습니까?

위 내용은 js를 사용하여 이미지를 로컬로 다운로드하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿