ファイルダウンロード機能のAjax実装を詳しく解説-jsチュートリアル-php.cn

ファイルダウンロード機能のAjax実装を詳しく解説

php中世界最好的语言

リリース： 2018-04-24 17:09:14

オリジナル

3814 人が閲覧しました

今回は、Ajaxの実装ファイルダウンロード機能について詳しく説明します。Ajax実装におけるファイルダウンロード機能の注意点は何ですか?実際の事例を見てみましょう。

JQueryのajax関数の戻り値の型はxml、text、json、htmlなどの型のみで、「stream」型がないため、ajaxダウンロードを実装したい場合、対応するajax関数を使用してファイルをダウンロードすることはできません。。ただし、js を使用してフォームを生成し、このフォームを使用してパラメーターを送信し、「ストリーム」タイプのデータを返すことができます。実装プロセス中、ページは更新されませんでした。

1. ajaxを使用すると、ajaxの戻り値の型はjson、text、html、xml型、またはajaxの送受信はstring

stringのみとなり、stream型にはできないと言えるので、ファイルのダウンロードは実行できません。無理に使用すると、応答の競合が発生します。 ajax を使用する必要がある場合は、生成されたファイル関連の URL を値を返すことによってのみ取得できます。次に、コールバック関数で iframe を作成し、その src 値をファイル URL、またはファイル生成ストリームの処理 URL に設定します。これにより、ページを更新せずにファイルをダウンロードできるようになります。

2. Ajax を使用せずに、DOM を動的に操作するか、iframe またはフォームを作成することで実現できます。iframe の src は、ファイルを直接ダウンロードするファイルアドレス URL になります。応答ストリーム出力を通じて処理 URL をダウンロードする形式は、DOM が動的に操作される場合に、ページを更新せずにファイルのダウンロードを実現します。。ダウンロード中に

進行状況バーを実装するには、スケジュールされたタスクを作成し、一定の間隔でバックグラウンドにリクエストを送信し、セッションなどのパブリックオブジェクトを通じてファイルのダウンロードの進行状況を取得できます。

var title=$("input[name='gjzSelect']").val();
var rqTime = $(".ui-datepicker-time").val();
var ddd= rqTime.split("一");
var startTime=ddd[];
var endTime=ddd[];
var form = $("<form>"); //定义一个form表单
form.attr('style', 'display:none'); //在form表单中添加查询参数
form.attr('target', '');
form.attr('method', 'post');
form.attr('action', "<%=basePath%>jiankong/madeExcel.do");
var input = $('<input>');
input.attr('type', 'hidden');
input.attr('name', 'startTime');
input.attr('value', startTime);
var input = $('<input>');
input.attr('type', 'hidden');
input.attr('name', 'endTime');
input.attr('value', endTime);
var input = $('<input>');
input.attr('type', 'hidden');
input.attr('name', 'title');
input.attr('value', title);
$('body').append(form); //将表单放置在web中
form.append(input); //将查询参数控件提交到表单上
form.append(input);
form.append(input);
form.submit();
<%-- 
$.ajax({
url:'<%=basePath%>jiankong/madeExcel.do',
cache:false,
data:{
'startTime':startTime,
'endTime':endTime,
'title' :title
},
error:function (e){
alert("导出失败！");
},
success:function (data){
alert("导出成功！");
} 
}); 
--%>

ログイン後にコピー

この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

jquery での ajax 実行順序の調整

Ajax インスタンスと $.ajax インスタンスの詳細な説明

jQuery が監視ページに対して ajax リクエストを行う方法

以上がファイルダウンロード機能のAjax実装を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。