测试浏览器是否支持多个文件上传？

Question

Is there a way to test if a given browser supports the multiple attribute on file upload elements? Either a server-side or client-side implementation is sufficient.

I do realize I can test the user-agent against a list of known browsers that support the feature, but that seems like a rather frail implementation (ie. if IE 10 supports the feature when it finally launches, the I'll have to go edit back my code). I'd prefer to test support of the feature directly.

Thoughts?

Answer 1

Since this functionality is part of the HTML5 specification and is only just emerging in current implementations, you may not yet have a definitive and reliable way to do this. Want to know for sure? Then test it on as many browsers as possible. However, with that said, the code segment found at:

https://developer.mozilla.org/en/DOM/Input.multiple

does show that you should be able to determine this based on a simple test for the existence of the "multiple" attribute like is commonly used in many other elements.

Answer 2

我建议"multiple" in document.createElement("input")使用"multiple" in document.createElement("input")进行特征检测。

Answer 3

There is no reliable way to do this at present time, as has been evidenced by Viljami Salminen's tests of file upload support on mobile browsers (ie support for input type=file - let alone for multiple file upload). His findings show that many browsers/devices falsely report support .

What I mean by "no reliable way to do this at present time" is that we don't have a list of false positives for this particular feature, the HTMLInputElement.multiple property. Obviously the list would include the entire regexp of false positives for input type=file , but would likely also include additional false positives just for this particular feature - hence the ability to detect this capability awaits a systematic test of browsers.

Temporarily, you could use the following test, based entirely on Salminen's code, with the addition of one line ( el.multiple = true; ), and substituting xxx for the regexp referenced above.

var isMultipleFileInputSupported = (function () {
    // Handle devices which falsely report support
    if (navigator.userAgent.match(/xxx/)) {
        return false;
    }
    var el = document.createElement('input');
    el.type = 'file';
    el.multiple = true;
    return !el.disabled;
})();

Usage example:

if (isMultipleFileInputSupported) {
    console.log('multiple file input is supported');
} else {
    console.log('multiple file input is NOT supported');
}