Question

好的，这是与我上一篇文章相同的帖子，该文章被下调并标记为重复。这里再次发布帖子，但现在解释为什么What is the cleanest way to get the progress of JQuery ajax request?的问题不起作用。

我有一个AJAX请求，我在数据库中插入东西并发送2 电子邮件。我想展示AJAX请求的进度。

目前我尝试过：

$.ajax({
    type: 'POST',
    url: '/ajax/submit_order_form.php',
    data: form_data,
    xhr: function() {
        var xhr = new window.XMLHttpRequest();
        xhr.addEventListener('progress', function(e) {
            if (e.lengthComputable) {
                $('title').html((100 * e.loaded / e.total) + '%');
            }
        });
        return xhr;
    },
    complete: function() { /*here some stuff*/ }
});

但是，它在请求期间不会更改标题，但在请求之后将其设置为100％。有什么方法可以得到我想要的东西吗？因此，当执行AJAX文件中的50％时，它会显示50％，并且会像这样进行。

接下来我尝试的是：

$.ajax({
    type: 'POST',
    url: '/ajax/submit_order_form.php',
    data: form_data,
    chunking: true,
    xhr: function() {
        var xhr = new window.XMLHttpRequest();
        xhr.upload.addEventListener("progress", function(evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                $('title').html(percentComplete);
                //Do something with upload progress here
            }
        }, false);

        xhr.addEventListener("progress", function(evt) {
            if (evt.lengthComputable) {
                var percentComplete = evt.loaded / evt.total;
                $('title').html(percentComplete);
                //Do something with download progress
            }
        }, false);

        return xhr;
    },
    complete: function (result){}});

然而，我只在标题中获得1，并且当我点击我的按钮并且调用AJAX时立即获得。

最后，我尝试了第二个答案：

$.ajax({
    type: 'POST',
    url: '/ajax/submit_order_form.php',
    data: form_data,
    chunking: true,
    complete: function (result) {}
}).progress(function(e, part) {
    console.log(part);
}).progressUpload(function()
{

});

然而，这给出了：

jq-ajax-progress.min.js:1 Uncaught TypeError: Cannot read property 'upload' of undefined
at Function.e.ajax (jq-ajax-progress.min.js:1)
at a.validator.submitOrderForm (checkout.js:108)
at d (jquery.validate.min.js:4)
at HTMLFormElement.<anonymous> (jquery.validate.min.js:4)
at HTMLFormElement.dispatch (jquery.min.js:3)
at HTMLFormElement.r.handle (jquery.min.js:3)

我已经尝试了很多东西，但似乎都没有用。

jQuery.ajax请求进度条

0 个答案: