javascript - JavaScript 中的本地文件支持检测 - Windows Phone 8 Bug

Question

我有一个关于 <input type=file> 的问题HTML 元素——特别是，为什么所有迹象都表明它在 Windows Phone 8 (IE 10 Mobile) 上受支持，但它确实不起作用。

我一直在做一个照片 uploader 项目，在 Javascript 开发中，我有适当的逻辑来检查文件 API 支持，所以我知道我是否可以支持本地文件选择。令人惊讶的是，我的代码返回了 true Windows Phone 8 上的值。这应该不是问题，但是 <input type=file> WP 8 并不真正支持元素(如 Windows 博客中的 article about IE 10 for Mobile 所述)。 WP 8 的结果是 <input type=file>元素在页面上，它显示得很好，但单击“浏览”按钮时没有任何反应。

我检查文件 API 支持的 JS 代码是:

function checkLocalFileSupport() {
   if (window.File && window.FileReader && window.FileList && window.Blob) {
       return true;
   }
   return false;
}

我希望有人可以阐明如何更好地检查和确认本地文件选择在特定设备/浏览器上是否可用。正如我所说，我当前的解决方案返回 true在 WP 8 上。我一直在尝试各种不同的方法来查看是否 <input type=file>已启用(下面的片段)，但所有其他解决方案仍返回 true对于 WP 8。

一个警告是:我真的希望代码与设备无关。因此，我不想嗅探浏览器用户代理。在我看来，用户代理嗅探是一种我宁愿不必实现的后备措施。

这是我找到并尝试过的一些解决方案，但仍然返回 true在 WP 8 上:

引用 disabled输入元素的属性:

function isInputTypeFileImplemented() {
    var elem = document.createElement("input");
    elem.type = "file";
    if (elem.disabled) return false;
    try {
        elem.value = "Test"; // Throws error if type=file is implemented
        return elem.value != "Test";
    } catch(e) {
        return elem.type == "file";
    }
}

使用 jquery.support:

var support = (function(undefined) {
    return $("<input type='file'>")    // create test element
                 .get(0)               // get native element
                 .files !== undefined; // check whether files property is not undefined
})();

希望有人能帮助阐明如何准确地让 WP 8 返回 false本地文件支持的值。

提前致谢!

Answer 1

根据 this blog post一些系统返回误报支持，您可以通过使用 RegExp 检查它们来克服这个问题，例如

if (navigator.userAgent.match(/(Android (1.0|1.1|1.5|1.6|2.0|2.1))|(Windows Phone (OS 7|8.0))|(XBLWP)|(ZuneWP)|(w(eb)?OSBrowser)|(webOS)|(Kindle\/(1.0|2.0|2.5|3.0))/)) {
   return false;
}