onclick事件触发 input type=“file” 上传文件

添加按钮：

　　<input type="button" name="button" value="浏览" onclick="javascript:openBrowse();" />

 

<script type="text/javascript"> 

function openBrowse(){ 

　　var ie=navigator.appName=="Microsoft Internet Explorer" ? true : false; 

　　if(ie){ 

　　　　document.getElementById("file").click(); 

　　}else{

　　　　var a=document.createEvent("MouseEvents");//FF的处理 

　　　　a.initEvent("click", true, true);  

　　　　document.getElementById("file").dispatchEvent(a); 

　　} 

} 

</script> 










考虑一下下面的HTML：

<input type="file" id="fileElem" multiple accept="image/*" style="display：none" onchange="handleFiles(this.files)"><a href="#" id="fileSelect">Select some files</a>

为自定义的按钮绑定click事件：

var fileSelect = document.getElementById("fileSelect"),    fileElem = document.getElementById("fileElem");fileSelect.addEventListener("click", function (e) {  if (fileElem) {    fileElem.click();  }  e.preventDefault(); // prevent navigation to "#"}, false);

如此一来，虽然input:file还是必要的，但就没必要说覆盖在<button>上方，随便找个地方隐藏掉就好了，实在是方便了许多。