How to call file input click with jquery?

Question

i want to call click event of file input only by jquery, but when i use this below code, it doesn't work:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <script src="js/jquery.js"></script>
    <script>
        $(function () {
            setTimeout(function () {
                $('#file').trigger('click');
            }, 2000);
        });
    </script>
</head>
<body>
    <input id="file" name="file" type="file" />
</body>
</html>

NOTE

I want to do this only with jquery or javascript.

possible duplicate of Programmatically trigger "select file" dialog box — technophobia
– technophobia, Commented May 12, 2015 at 18:56
A very important note here regarding triggering the file input programatically: stackoverflow.com/a/21583865/984275 — technophobia
– technophobia, Commented May 12, 2015 at 18:57

Victor · Accepted Answer · 2015-05-12 18:51:48Z

9

Just do it!

With jQuery:

$('#file').click();

Pure javascript:

var fileInput = document.getElementById('file');
if(fileInput) {
     fileInput.click();
}

$(document).ready(function() {
  $('#btn').click(function() {
    // Will Work!!!!
    $('#fileInput').click();
  });
  // Will not Work
  $('#fileInput').click();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<input type="file" id="fileInput" />
<br/>
<br/>
<button id="btn">Click</button>

Your problem is that I need to call the click event from a user action. Take a look in the example. The click called inside the ready event doesn't work, because is not a user event. But the same code from click work.

edited May 12, 2015 at 18:51

answered May 12, 2015 at 18:44

Victor

8,48914 gold badges87 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

brso05 Over a year ago

@RasoolGhafari what isn't working for you what error message are u getting if any?

brso05 Over a year ago

@RasoolGhafari I think it must be triggered by a user event like a user clicking another button...I don't think it will work in setInterval().

Rasool Ghafari Over a year ago

@Victor, i know that way, but i want to trigger click without user action

Victor Over a year ago

I fixed the example. It's a security issue.

Victor Over a year ago

Without an user action I don't know if you can do it. With a delay, take a look in this example: jsfiddle.net/eyedean/1bw357kw

Collectives™ on Stack Overflow

How to call file input click with jquery?

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related