自定义文件选择器，不使用<input type =“file”/>

Question

我正在研究一个基于java（webwork framework）的web-app，其中需要首先压缩要上传的文件。由于无法通过javascript设置“input type ='file'”元素的值，我决定采用嵌入式applet的路径。基本上这个小程序压缩所选文件，然后通过scp将压缩文件上传到服务器。

它运作良好，但我在网页本身的呈现方面存在问题。我正在考虑而不是在applet中实现文件选择器，如果有一个我可以使用的现有文件选择器。当然没有放任何“输入类型='文件'”。

非常感谢您对这些现有自定义网络文件选择器的链接。

Answer 1

由于安全限制，使用HTML选择文件的唯一方法是向文档添​​加<input type=file>。然后，用户应选择具有真实点击的文件。

请注意，javascript能够（在现代浏览器中）读取文件的内容，因此它不能选择任意文件并阅读它。

Answer 2

这总是有效的。

<div id="input_container" style="width: 0px; height: 0px; overflow: hidden"><input type="file" id="inputfile" /></div>
<div class="button" onclick="upload();">Upload file</div>

和你的剧本

function upload(){
 document.getElementById('inputfile').click();
}

你的CSS

.button {
   /*button style here*/
}