由于各浏览器的<input type="file">兼容性差异很大，在涉及多语言的项目中，浏览二字无法翻译，虽然有可能随着系统语言环境的不同而不同，但是论证一番还是觉得不靠谱，于是写个兼容的东东，方便使用，效果图及代码如下：
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>File上传域兼容</title>
<style type="text/css">
body{margin:0;font:12px/1.5 arial,"simsun";}
input:focus{outline:0;}
input::-moz-focus-inner{border:0;padding:0;}
.module_import{width:300px;margin:20px auto;}
.tc{text-align:center;}.pr{position:relative;}.pa{position:absolute;}.poi{cursor:pointer;}
.a_browse{width:140px;height:34px;line-height:34px;display:inline-block;background-color:#dedede;border:1px solid #ccc;border-radius:5px;box-shadow:0 1px 1px rgba(0,0,0,0.1);overflow:hidden;text-align:center}
.a_browse:hover{background-color: #ccc;border:1px solid #bbb;}
.input_file{width:142px;height:34px;left:-2px;top:0;font-size:100em; opacity:0;-moz-opacity:0;filter:alpha(opacity=0); }
</style>
</head>
<body>
<div class="module_import tc">
<form enctype="multipart/form-data" id="form_upload" method="post" >
<p calss="module_import_p">
<a class="a_browse pr poi tc">
选择文件<input class="input_file pa poi" id="file_import" type="file" name="file">
</a>
</p>
</form>
</div>
</body>
</html>
设置font-size:100em;的原因是IE6-8的点击无效，一般点击按钮才能触发。
下面是「FED实验室」的微信公众号二维码，欢迎扫描关注：
