站长新闻

怎么拿到input file上传的文件名字显示到页面中

文章来源：老客SEO 作者：老客SEO 人气：17 2019-07-12 10:12:13

js代码部分：

							
											01
										
											$(".aFileBtn").on("change","input[type='file']",function(){
									
											02
										
											    var filePath=$(this).val();
									
											03
										
											    //filePath.indexOf("jpg")!=-1 || filePath.indexOf("png")!=-1
									
											04
										
											    if(filePath.length > 0){
									
											05
										
											        $(".fileerrorTip").html("").hide();
									
											06
										
											        var arr=filePath.split('');
									
											07
										
											        var fileName=arr[arr.length-1];
									
											08
										
											        $(".showFileName").html(fileName);
									
											09
										
											    }else{
									
											10
										
											        $(".showFileName").html("");
									
											11
										
											        $(".fileerrorTip").html("您未上传文件，或者您上传文件类型有误！").show();
									
											12
										
											        return false
									
											13
										
											    }
									
											14
										
											})

html文件部分：

							
											1
										
											<a class="selfConBtn aFileBtn">选择文件<input type="file"  /></a>
									
											2
										
											        <span class="fileerrorTip"></span>
									
											3
										
											         <span class="showFileName"></span>
									
											4
										
											 <a href="#"  class="selfConBtn">点击上传</a>