检查XHR和progress-event的浏览器功能 [英] Check browsers capability of XHR and progress-event

问题描述

关注此问题：

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

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

how can I make it compatible for older browsers?

正如您在上面的问题中所看到的，我依赖于XHR和进展事件。现在对于旧浏览器，我需要检测它们是否不具备其中一个，所以我可以跳过进度条并仍然可以发布我的AJAX帖子。

As you can see in the question above, I am relying on XHR and the progress-event. Now for older browsers, I need to detect if they are not capable of one of these so I can skip the progress-bar and still make my AJAX-post.

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

I thought it could work like this:

$.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",
...

但我不知道是不是保存或如果我需要检查其他任何事情。

but I don't know if that's save or if there's anything else I'd have to check.

谢谢！

推荐答案

对于接近完全安全的东西，你可以使用try / catch / finally结构：

For something close to total safety, you could use a try/catch/finally structure :

$.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",
    ...
}):

这篇关于检查XHR和progress-event的浏览器功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！