单击span中的隐藏文件输入会导致RangeError

Question

我有HTML：

<span class="btn btn-success js-uploader">
    <i class="icon-upload icon-white"></i> Upload
    <input type="file" multiple>
</span>

jQuery / JavaScript：

$('.js-uploader').click(function(){
    $(this).find('input[type="file"]').click();
});

基本上，当单击类.js-upload的范围时，也应单击文件输入。但是当我使用.find()或.js-uploader > input[type="file"]时，会导致RangeError。

Answer 1

控制台消息：too much recursion

当你点击输入时它也会加速到span，但是span click-handler也会导致点击输入

尝试检查event.target是否输入

$('.js-uploader').click(function(e){
     if ($(e.target).is('input[type="file"]')) return;
     $(this).find('input[type="file"]').click();
});

Answer 2

沉重的递归..检查这里的小提琴..你会知道http://jsfiddle.net/umBWV/1/