Calling input type in a function

Question

The aim is that when the page is loaded, an onload call to a function will be made and inside this function will be an input type which will access a devices camera.

How can i call an input type inside a JavaScript function?

    <!DOCTYPE HTML>
<html>
<head>
<title>Take Picture</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />

<script type="text/javascript">

    function getPic()
    {
        <input type="file" id="takePic" style="display: none;" accept="image/*;capture=camera">
    }
</script>  

</head>

<body onload="getPic()">

EDIT : The line of code below allows access to the device's camera, which works fine.

<input type="file" id="takePic" accept="image/*;capture=camera">

basically what i want is, when the page loads, it automatically clicks the choose file button from the above piece of code. I assumed the best way to do this was by JS. I may be wrong.

I have very little knowledge of JS so i came here for help after finding little on the net.

I don't really understand what you mean by *"call an input type"*. Do you want to create an `input` DOM element and insert it into the tree? — Felix Kling, Mar 21 '13 at 12:00
I have updated the question, hopefully it makes a little more sense. — user1081326, Mar 21 '13 at 12:18
I believe you will find your answer (not necessarily solution) here: http://stackoverflow.com/questions/210643/in-javascript-can-i-make-a-click-event-fire-programmatically-for-a-file-input. — Felix Kling, Mar 21 '13 at 13:15

score 0 · Answer 1 · answered Mar 21 '13 at 12:00

If you want to add input in body use document.write

function getPic()
{
    document.write('<input type="file" id="takePic" style="display: none;" accept="image/*;capture=camera">');
}

If you want to access that input use getElementById().

document.getElementById('takePic')

score 0 · Answer 2 · answered Mar 21 '13 at 12:43

If your goal is taking a snapshot from a webcam, you might be better off using the navigator.getUserMedia() API.

See this page for details: http://www.html5rocks.com/en/tutorials/getusermedia/intro/

It's unsupported in IE and Safari, but works in current versions of Firefox, Chrome and Opera: http://caniuse.com/#feat=stream

Calling input type in a function

2 Answers2