Javascript PushState上的进度条

代码如下：

$.ajax({                        
        type: "POST",
        url: url,
        xhr: function(e) {
            //Download progress         
            xhr.addEventListener("progress", function(evt){
                console.log(evt.lengthComputable);
              if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                //Do something with download progress
                console.log(percentComplete);
              }
            });
            return xhr;
        },
        dataType: "json",
        success: function(data){

        }
    });

这是我用来从Codeigniter检索视图的函数。我想在加载页面的同时显示一个进度条。然而，当我把XHR放在AJAX函数中时，一切都停止了工作。有人知道我如何使用进度条运行它吗

---

提前谢谢

您遗漏了一个变量声明，因此代码无法编译

xhr: function () {
    var xhr = new window.XMLHttpRequest(); // <<<<<<< missed this variable
    //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;
},

xhr:function（）{
var xhr=new window.XMLHttpRequest（）；//谢谢你的回答。但是，我得到的evt.LengthComputeable为false。你知道是什么导致它为false吗？我设法使它为true，但现在在加载完成后，我只得到数字1。我想进度条更多的是用于上传和下载文件。从jQuery 1.9.3+开始，此方法不起作用。它将我不知道为什么它不再工作了。