本文介绍如何使用纯JavaScript和jQuery实现无需插件的文件上传功能。重点解决Chrome浏览器中隐藏input:file无法触发click事件的问题，通过设置透明度实现视觉隐藏。同时针对IE6/7不支持onchange事件的特性，提供兼容IE浏览器的触发click与change事件方案，确保跨浏览器环境下的文件选择功能正常运作。
代码如下：
HTML结构与CSS隐藏技巧<span class="up-btn" id="selectFile">请选择文件</span>
<input type="file" name="fileupload" style="FILTER: alpha(opacity=0); moz-opacity: 0; opacity: 0;" />点击#selectFile元素以触发input:file的click事件。
jQuery事件触发与浏览器兼容处理
代码如下：
jQuery('#selectFile').live('click',function(){
var ie = !-[1,];
if(ie){
jQuery('input:file').trigger('click').trigger('change');
}else{
jQuery('input:file').trigger('click');
}
});选中文件后需要触发的事件处理逻辑。
文件选择后的事件响应
代码如下：
jQuery('input:file').change(function(){
//dosomthing
}); 注意事项：
浏览器兼容性注意事项
1、在Chrome浏览器环境下，出于数据安全考虑，隐藏的input:file无法直接通过trigger触发“click”事件。因此，解决方案是设置input:file的透明度为0，从而达到视觉隐藏的效果。
2、在IE6和IE7浏览器中，input file控件不支持onchange事件。因此，在这些旧版浏览器中，仍需使用标准的<input type="file" value="" />标签进行文件选择。