8
$.ajax({
  xhr: function()
  {
    var xhr = new window.XMLHttpRequest();
    //Upload progress
    xhr.upload.addEventListener("progress", function(evt){
      if (evt.lengthComputable) {
        var percentComplete = evt.loaded / evt.total;
        //Do something with upload progress
        console.log(percentComplete);
      }
    }, false);
    //Download progress
    xhr.addEventListener("progress", function(evt){
      if (evt.lengthComputable) {
        var percentComplete = evt.loaded / evt.total;
        //Do something with download progress
        console.log(percentComplete);
        }
      }, false);
    return xhr;
  },
  type: 'POST',
  url: "/",
  data: {},
  success: function(data){
    //Do something success-ish
  }
});

これは jQuery 1.5+ では機能しません。これは、xhr が jqXHR (つまり、生の XHR の高レベル バージョン) に置き換えられているためです。問題は、jqXHR で機能させる方法です... 方法を知っている人はいますか?

4

3 に答える 3

11

これを試して

$.ajax({
    url: path,
    xhr: function () {
        var xhr = $.ajaxSettings.xhr();
        xhr.upload.onprogress = function (e) {
            if (e.lengthComputable) {
                console.log(e.loaded / e.total);
            }
        };
        return xhr;
    }
}).done(function (e) {

})
于 2014-03-17T17:26:19.207 に答える
4

簡単な方法でアップロードまたはダウンロードの進行状況イベントを処理する jquery プラグインを作成しました。$.ajax、$.get、$getJSON、$.post などの任意の jquery ajax メソッドで動作します。ここからダウンロードできます: https://github.com/cvelazquez/jquery.ajax.progress

var jqXHR = $.post('www.somedomain.com', {data:"real long data, o maybe a file upload"}, function(response){
    /* do anything on finish */
});

$(jqXHR).on('uploading', function(proxyEvent, event){
    if (event.lengthComputable) {
        // You can do anything here
        console.log("Uploaded " + parseInt( (event.loaded / event.total * 100), 10) + "%");
    }
});
于 2015-03-15T11:21:52.307 に答える
1

ドキュメントやその他の質問を検索すると、jquery ajax の進行状況を監視するプラグインがあるようです: https://github.com/hiddentao/jquery.ajaxprogress

于 2012-11-02T21:46:02.907 に答える