小编Dav*_*ave的帖子

我正在尝试使用XMLHttpRequest 2级支持进度事件来实现HTML5方式的上传进度条.

在您看到的每个示例中,方法是向progress事件添加事件侦听器,如下所示:

req.addEventListener("progress", function(event) {
    if (event.lengthComputable) {
        var percentComplete = Math.round(event.loaded * 100 / event.total);
        console.log(percentComplete);
    }
}, false);

这些示例似乎总是假设event.lengthComputable将为true.毕竟,浏览器肯定知道它发送的请求的长度？

无论我做什么,event.lengthComputable都是false.我已经在Safari 5.1.7和Firefox 12上测试了这两个,这两个都在OSX上.

我的网站是使用Django构建的,我在开发和生产设置上遇到了同样的问题.

我用来生成表单上传的完整代码如下所示(使用jQuery):

form.submit(function() {
    // Compile the data.
    var data = form.serializeArray();
    data.splice(0, 0, {
        name: "file",
        value: form.find("#id_file").get(0).files[0]
    });
    // Create the form data.
    var fd = new FormData();
    $.each(data, function(_, item) {
        fd.append(item.name, item.value);
    });
    // Submit the data.
    var req = new XMLHttpRequest();
    req.addEventListener("progress", function(event) {
        if (event.lengthComputable) {
            var percentComplete = …