Question

我有一个像这样的HTML表单：

<style>.hidden { display: none; }</style>

<form method="post" action="upload">
    <div id="dropzone" class="pre-upload">
        <div class="comp">
            <h1>Drop your images here</h1>
            <p>or simply click to select them.</p>
            <input type="file" name="images" id="upload_button" class="hidden" />
        </div>
            <div class="fing">
                <p>Tap to select your images</p>
            </div>
    </div><!-- Pre upload div -->
</form>

我想让#dropzone打开标准文件选择窗口，如果它被点击了。它应该专门打开#upload_button的文件选择器。

我尝试了以下内容，但它无效：

$('#dropzone').click(function(){
    $('#upload_button').click();
});

如你所见，我正试图通过jQuery实现这个结果。

我认为这会触发窗口，但它什么都不做。

@投票决定将其关闭的人：

如您所见，在您链接的其他问题中，我的问题完全没有得到解答。错误地嵌套input这是一个不同的问题。因此，在进行并盲目投票结束之前，请更好地检查提供的代码并尝试查看问题是否与常见问题有所不同。毕竟这是一个求助的网站。

Answer 1

它看起来像一个循环引用问题。您的文件上传按钮位于要单击以触发按钮的div内。从div中触发单击按钮，也会触发div上的单击，因此它会无限地递归。

如果您观看控制台，则会看到出现"Maximum call stack size exceeded"错误。

将按钮移动到要单击的div之外会使其按预期运行。

这是展示问题的jsfiddle。

从其他位置触发文件选择窗口

@投票决定将其关闭的人：

1 个答案: