js 实现 input file 文件上传

Posted Mr. Li

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js 实现 input file 文件上传相关的知识，希望对你有一定的参考价值。

 

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script src="js/jquery/jquery-1.8.2.min.js" type="text/javascript"></script> 
<style type="text/css"> 
._box 
{ 
width: 119px; 
height: 37px; 
background-color: #53AD3F; 
background-image: url(images/bg.png); 
background-repeat: no-repeat; 
background-position: 0 0; 
background-attachment: scroll; 
line-height: 37px; 
text-align: center; 
color: white; 
cursor: pointer; 
} 
.none 
{ 
width: 0px; 
height: 0px; 
display: none; 
} 
</style> 
<title>js 实现 input file 文件上传 /></title> 
</head> 
<body> 
<form id="form1" runat="server" method="post" enctype="multipart/form-data"> 
<div> 
<div class="_box">选择图片</div> 
</div> 
<div class="none"> 
<input type="file" name="_f" id="_f" /> 
</div> 
</form> 
</body> 
</html> 
<script type="text/javascript"> 
jQuery(function () { 
$("._box").click(function () { 
return $("#_f").click(); 
}); 
}); 
</script>

　　

以上是关于js 实现 input file 文件上传的主要内容，如果未能解决你的问题，请参考以下文章

input实现多文件上传及图片预览

js 实现 input file 文件上传

使用js清空input file上传文件的内容

input file图片上传预览js实现

input file 文件上传,js控制上传文件的大小和格式

input file 文件上传,js控制上传文件的大小和格式