如何测试浏览器是否支持<输入捕获/>

Question

如何测试当前浏览器是否支持移动浏览器的功能来使用设备摄像机拍照？

https://addpipe.com/html-media-capture-demo/

在所有桌面浏览器中，捕获基本上都被忽略：https://caniuse.com/#feat=html-media-capture

如何检测是否可以使用capture (而且它不会显示打开的文件对话框，但实际上会打开图片应用程序)？

Answer 1

您可以在JS中创建一个输入元素，并测试capture属性。如果不支持，它将是未定义的。

​

var el = document.createElement('input')
var supported = el.capture != undefined

console.log('capture supported: '+supported)

​

下面是在iOS模拟器中的样子

​

​

Answer 2

您可以使用以下函数：

function supported(attribute) {
   var i = document.createElement('input');
   i.setAttribute(attribute, true);
   return !!i[attribute];
}

您可以调用它，比如supported('capture')，或者如果您想测试accept属性supported('accept')

资料来源： http://anssiko.github.io/html-media-capture/