<style type="text/css">
.input-file{
display: inline-block;
position: relative;
overflow: hidden;
text-align: center;
width: auto;
background-color: #2c7;
border: solid 1px #ddd;
border-radius: 4px;
padding: 5px 10px;
font-size: 12px;
font-weight: normal;
line-height: 18px;
color:#fff;
text-decoration: none;
}
.input-file input[type="file"] {
position: absolute;
top: 0;
right: 0;
font-size: 14px;
background-color: #fff;
transform: translate(-300px, 0px) scale(4);
height: 40px;
opacity: 0;
filter: alpha(opacity=0);
}
</style>
<script>
$(function(){
$(".input-fileup").on("change","input[type='file']",function(){
var filePath=$(this).val();
if(filePath.indexOf("pdf")!=-1 || filePath.indexOf("pdf")!=-1){
$(".fileerrorTip1").html("").hide();
var arr=filePath.split('\\');
var fileName=arr[arr.length-1];
$(".showFileName1").html(fileName);
}else{
$(".showFileName1").html("");
$(".fileerrorTip1").html("您未上传文件,或者您上传文件类型有误!").show();
return false
}
})
})
</script>
<a class="input-file input-fileup" href="javascript:;">
+ 选择文件<input size="100" type="file" name="file" id="file">
</a>
<div class="fileerrorTip1"></div>
<div class="showFileName1"></div>