ホームページ > 記事 > ウェブフロントエンド > jsでファイルをダウンロードする簡単な操作について(コード添付、詳しい回答)
以下は、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などの型のみで、「ストリーム」型はありません。そのため、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でファイルをダウンロードする簡単な操作について(コード添付、詳しい回答)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。