效果图：

 

  

  

 

 

 

HTML：

<a href="javascript:;" class="file">
　　　　<span>选择apk</span>
　　　　<input type="file" name="file" multiple="multiple" />
</a>

CSS:

/*input flie css美化*/
.file {  font-size:0.8em; position:relative; display:inline-block; background:#fe770a; border-radius:1em; padding:0.3em 1em; overflow:hidden; color:#fff; text-decoration:none; text-indent:0; cursor:pointer; }
.file input { position:absolute; font-size:100px; right:0; top:0; opacity:0; }
.file:hover { background:#ffa55d;color:#fff; text-decoration:none;}
.file span{ max-width:6em; overflow:hidden; display:block; white-space:nowrap; text-overflow:ellipsis; }
.fileerrorTip,.showFileName{ color:#fe0000; font-size:0.9em; padding:0 0 0 0.5em; }
.showFileName{ color:#fe770a;  }

JS:

//上传文件
$(".file").on("change","input[type='file']",function(){
　　var filePath=$(this).val();
　　$(".file span").html(filePath);
　　if(filePath.indexOf("apk")!=-1 ){
　　　　　　$(".fileerrorTip").html("").hide();
　　　　　　var arr=filePath.split('\\');
　　　　　　var fileName=arr[arr.length-1];
　　　　　　$(".showFileName").html(fileName);
　　}else{
　　　　　　$(".showFileName").html("");
　　　　　　$(".fileerrorTip").html("这他妈是APK吗??").show();
　　　　　　return false 
　　}
})