> 웹 프론트엔드 > JS 튜토리얼 > js에서 파일을 다운로드하는 간단한 조작에 대해(코드 첨부, 자세한 답변)

js에서 파일을 다운로드하는 간단한 조작에 대해(코드 첨부, 자세한 답변)

亚连
풀어 주다: 2018-05-18 10:25:30
원래의
2135명이 탐색했습니다.

다음은 제가 컴파일한 js 파일을 다운로드하는 간단한 작업입니다.

일반 다운로드
예를 들어, 파일을 다운로드할 주소는 다음과 같습니다: http://127.0.0.1/test.rar

//该方法在火狐上没有效果的,在IE浏览器上是可以的window.open("htpp://127.0.0.1/test.rar");
//该方法火狐有些版本是不支持的window.location.href="htpp://127.0.0.1/test.rar";
//为了解决火狐有些版本不支持,可以改成这种方式window.location="htpp://127.0.0.1/test.rar"; 
//该方法IE和火狐都可以,
//url表示要下载的文件路径,如:
htpp://127.0.0.1/test.rar
function downloadFile(url) {   
   try{ 
        var elemIF = document.createElement("iframe");   
        elemIF.src = url;   
        elemIF.style.display = "none";   
        document.body.appendChild(elemIF);   
    }catch(e){ 
        zzrw.alert("下载异常!");
    }     
}
//表单方式直接下载文件
//url表示要下载的文件路径,如:
htpp://127.0.0.1/test.rar
function downloadFile(url)
{
    var form=$("<form>");//定义form表单,通过表单发送请求
    form.attr("style","display:none");//设置为不显示
    form.attr("target","");
    form.attr("method","get");//设置请求类型  
    form.attr("action",url);//设置请求路径
    $("body").append(form);//添加表单到页面(body)中
    form.submit();//表单提交
}1234567891011121314151617181920212223242526272829303132333435363738394041424344
로그인 후 복사

페이지로 이동하지 않고 백그라운드 다운로드를 요청하면 백그라운드에서 데이터 스트림을 반환합니다.

JQuery의 ajax 함수의 반환 유형은 xml, text, json, html 및 기타 유형뿐이고 "stream" 유형이 없으므로 ajax 다운로드를 구현하려면 해당 ajax 기능을 사용하여 파일을 다운로드할 수 없습니다. 하지만 js를 사용하여 양식을 생성하고, 이 양식을 사용하여 매개변수를 제출하고, "스트림" 유형 데이터를 반환할 수 있습니다. 구현 프로세스 중에 페이지가 새로 고쳐지지 않았습니다.

get request download

//url表示请求路径,进入后台处理,后台返回一个文件流//例如:url为htpp://127.0.0.1/test
function downloadFile(url){
    //定义一个form表单,通过form表单来发送请求
    var form=$("<form>");    //设置表单状态为不显示
    form.attr("style","display:none");    //method属性设置请求类型为get
    form.attr("method","get");    //action属性设置请求路径,(如有需要,可直接在路径后面跟参数)
    //例如:htpp://127.0.0.1/test?id=123
    form.attr("action",url);    //将表单放置在页面(body)中
    $("body").append(form);    //表单提交
    form.submit();
}12345678910111213141516171819202122232425262728
로그인 후 복사

post request download

//url表示请求路径,进入后台处理,后台返回一个文件流
//例如:url为htpp://127.0.0.1/test
function downloadFile(url){
//定义一个form表单,通过form表单来发送请求
var form=$("<form>");
//设置表单状态为不显示
form.attr("style","display:none");
//method属性设置请求类型为post
form.attr("method","post");
//action属性设置请求路径,
//请求类型是post时,路径后面跟参数的方式不可用
//可以通过表单中的input来传递参数
form.attr("action",url);
$("body").append(form);//将表单放置在web中
//在表单中添加input标签来传递参数
//如有多个参数可添加多个input标签
var input1=$("<input>");
input1.attr("type","hidden");//设置为隐藏域
input1.attr("name","id");//设置参数名称
input1.attr("value","123");//设置参数值
form.append(input1);//添加到表单中
form.submit();//表单提交
}
로그인 후 복사
위 내용은 제가 여러분을 위해 컴파일한 js 파일을 다운로드하는 간단한 작업입니다. 나중에 도움이 되길 바랍니다.

관련글 :

js에서 함수 앞에 코드가 붙어있는 문제

JS가 앱과 어떻게 상호작용하는지 자세히 설명(코드 첨부)

Js 자세히 설명 적용( ) 사용(코드 포함)

위 내용은 js에서 파일을 다운로드하는 간단한 조작에 대해(코드 첨부, 자세한 답변)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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