jQuery子文件上传点击

Question

I tried to run the code as and its working

<input type="file" />
<div class="image">

</div>
$('.image').click(function() {

    $('input').trigger('click');
});

Now, I want the code as

<div class="image">
<input type="file" />    
</div>
$('.image').click(function() {
    $(this).find('input').trigger('click');
});

and, I am not sure why this is not working.

Sample Fiddle is here. http://jsfiddle.net/CSvjw/1538/

Answer 1

Problem is:

Solution:

 $('.image').click(function(event) { if (!$(event.target).is('input')) { $(this).find('input').trigger('click'); } }); 

 input[type=file] { display: none; height: 0; width: 0; } .image { height: 100px; width: 100px; background-color: red; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <div class="image"> <input type="file" /> </div>