输入类型按钮时打开文件对话框 [英] Open file dialog when input type button

问题描述

在html中我们知道使用输入类型文件我们得到文件对话框来选择文件。有没有办法使用输入类型按钮打开文件对话框？
我们使用了

 < input type =fileclass =filename =attachement/> ; 
  

但我想用

 < input type =buttonclass =filename =attachement/> 
  

解决方案

是 - 您可以隐藏 input type =file但仍然在你的标记中。然后，您会在页面上显示常规按钮并点击该按钮，以编程方式触发实际文件输入的点击事件：

 < input id =fileInputtype =filestyle =display：none; /> 
< input type =buttonvalue =选择文件！的onclick =的document.getElementById（的FileInput）点击（）;。 /> 
  

小提琴： http://jsfiddle.net/cnjf50vd/

In html we know using input type file we get file dialog to select file. Is there any way to open file dialog using input type button? We used

<input type="file" class="file" name="attachement" />

But I want to use

<input type="button" class="file" name="attachement" />

解决方案

Yes - you can hide the input type="file" but still have it in your markup. You then show a regular button on your page and onclick of that button, you programmatically trigger the click event of your actual file input:

<input id="fileInput" type="file" style="display:none;" />
<input type="button" value="Choose Files!" onclick="document.getElementById('fileInput').click();" />

Fiddle: http://jsfiddle.net/cnjf50vd/

这篇关于输入类型按钮时打开文件对话框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！