javascript - 检查 XHR 和进度事件的浏览器功能

Question

在这个问题之后：

大文本字段的 jQuery AJAX 上传进度

如何使其与旧浏览器兼容？

正如您在上面的问题中看到的，我依赖于 XHR 和进度事件。现在对于较旧的浏览器，我需要检测它们是否无法使用其中之一，这样我就可以跳过进度条并仍然制作我的 AJAX-post。

我认为它可以像这样工作：

$.ajax({
        xhr: function() {
            var xhr = $.ajaxSettings.xhr();
            if (xhr instanceof window.XMLHttpRequest) {
                xhr.addEventListener('progress', function(event) {
                    if (event.lengthComputable) {
                        progressPercent = Math.round(event.loaded/event.total*100)+'%';
                        $loader.width(progressPercent);
                    }
                }, false);
            }else{
                alert('XHR is no instance of window.XMLHttpRequest');
            }
            return xhr;
        },
        type: "POST",
...

但我不知道这是保存还是我需要检查的其他内容。

谢谢！

Answer 1

对于接近完全安全的事情，您可以使用 try/catch/finally 结构：

$.ajax({
    xhr: function() {
        var xhr = $.ajaxSettings.xhr();
        try {
            xhr.addEventListener('progress', function(event) {
                if (event.lengthComputable) {
                    $loader.width(Math.round(event.loaded / event.total * 100) + '%');
                }
            }, false);
        }
        catch(err) {
            //Progess not available
            //Take appropriate action - eg hide the progress thermometer
            $loader.hide();
        }
        finally {
            return xhr;
        }
    },
    type: "POST",
    ...
}):