この記事の内容は、jsでファイルアップロードの進行状況を取得する方法についてです。ファイルのアップロードの進行状況を取得するための js コードです。必要な友人が参考になれば幸いです。
js ファイルアップロードの進行状況を取得する:
<input name="file" id="FileUpload" type="file" /> <input type="button" onclick="Submit()" value="提交" />
js モニタリング:
var xhrOnProgress=function(fun) { xhrOnProgress.onprogress = fun; //绑定监听 //使用闭包实现监听绑 return function() { //通过$.ajaxSettings.xhr();获得XMLHttpRequest对象 var xhr = $.ajaxSettings.xhr(); //判断监听函数是否为函数 if (typeof xhrOnProgress.onprogress !== 'function') return xhr; //如果有监听函数并且xhr对象支持绑定时就把监听函数绑定上去 if (xhrOnProgress.onprogress && xhr.upload) { xhr.upload.onprogress = xhrOnProgress.onprogress; } return xhr; } }
ajax ファイルアップロード関数:
function Submit(){ var fileObj = document.getElementById("FileUpload").files[0]; // js 获取文件对象 var formFile = new FormData(); formFile.append("file", fileObj); //加入文件对象 var data = formFile; $.ajax({ url: url, data: data, type: "Post", dataType: "json", cache: false,//上传文件无需缓存 processData: false,//用于对data参数进行序列化处理 这里必须false contentType: false, //必须 xhr:xhrOnProgress(function(e){ var percent=e.loaded/e.total;//文件上传百分比 console.log(percent); }), success: function (result) { console.log(result); }, }) }
完全なコード:えー
おすすめ関連記事:ネイティブ JavaScript を使用してカルーセル画像を実装するにはどうすればよいですか?詳細なコード説明
【js】: ユーザー入力の検出、テキストボックスのデフォルトスタイル設定、全選択と反転選択を実現するテーブルスタイルの設計
以上がjsでファイルのアップロードの進行状況を取得するにはどうすればよいですか?ファイルのアップロードの進行状況を取得するjsコードの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。