How to test if the browser support <input capture />

问题

How could I test if the current browser support the feature of mobile browsers to use the device camera to take a picture?

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

Capture is basically ignored in all desktop browsers: https://caniuse.com/#feat=html-media-capture

How could I detect if I can use capture (and that it won't show an open file dialog, but will actually open the picture application)?

回答1:

You can create an input element in JS and test for the capture property. It will be undefined if unsupported.

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

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

Here's what it looks like in the iOS simulator

回答2:

You can use the following function:

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

And you can call it, like supported('capture'), or if you want to test for the accept attribute supported('accept')

Source: http://anssiko.github.io/html-media-capture/

来源：https://stackoverflow.com/questions/51273828/how-to-test-if-the-browser-support-input-capture