input上传控件美化

在开发中，文件上传必不可少，<input type="file" /> 是常用的上传标签，但是它长得又丑、浏览的字样不能换，我们一般会用让

<input type="file" />隐藏，点其他的标签（图片等）来实现选择文件上传功能。 

<div> 
    <div class="_box">选择图片</div> 
</div> 
<div class="none"> 
    <input type="file" name="_f" id="_f" /> 
</div> 
<script type="text/javascript"> 
   $(function () { 
      $("._box").click(function(){ 
	 $("#_f").click(); 
      }); 
   }); 
</script>

但是在火狐和一些高版本的浏览器中后台可以获取到要上传的文件，一些低版本的浏览器压根就获取不到Request.Files

<script type="text/javascript"> 
   jQuery(function () { 
      $("._box").click(function () { 
        return $("#_f").click(); 
     }); 
   }); 
</script>

加了一个return关键字，兼容性提高了不少，但是有的浏览器还是不好用。 我们发现只有手动点击<input type="file" />后台就一定能获取到要上传的文件，于是我们可以透明<input type="file" /> 

<div class="_box"> 
    <input type="file" name="_f" id="_f" /> 
       选择图片 
    </div> 
<style>
  ._box input { 
      position: absolute; 
      width: 119px; 
      height: 40px; 
      line-height: 40px; 
      font-size: 23px; 
      opacity: 0; 
      filter: "alpha(opacity=0)"; 
      filter: alpha(opacity=0); 
      -moz-opacity: 0; 
      left: -5px; 
      top: -2px; 
      cursor: pointer; 
      z-index: 2; 
  } 
</style>