JavaScript中的“打开文件”对话框

Question

我需要一种解决方案，以在单击时以HTML显示打开文件对话框div。div单击时，必须打开打开文件对话框。我不想将输入文件框显示为HTML页面的一部分。它必须显示在单独的对话框中，该对话框不是网页的一部分。

Answer 1

我不知道为什么没人指出这一点，但是这是一种无需任何Javascript即可实现的方法，并且它还与任何浏览器兼容。

编辑：在Safari中，input当用隐藏时，将被禁用display: none。更好的方法是使用position: fixed; top: -100em。

<label>

  Open file dialog

  <input type="file" style="position: fixed; top: -100em">

</label>

如果你愿意，你可以走了“正确的方式”使用for的label指向id这样输入：

<label for="inputId">file dialog</label>

<input id="inputId" type="file" style="position: fixed; top: -100em">