项目需要 文件上传/下载 想用一个轻量级的框架,但是在网上搜索都没有找到于是想自己手写一个,但是由于浏览器限制不允许获取本地路径(IE除外)所以还是用了框架 ajaxfileupload 超轻量级的
JSP文件
<tr>
<td>上传附件:</td>
<td colspan="3">
<!-- 提交所用到的表单 -->
<form>
<!-- 显示上传文件名的文本框 disabled="value" 设置文本框为只读-->
<input type="text" disabled="value" name="uploadFile" id="uploadFile" style="width:300px;" class="float" >
<!-- file 框(原生的太难看,还改变不了样式,所以隐藏掉) 设置的onchange是为了实现自动上传(自动触发ajax) -->
<input type="file" name="upload_file" id="upload_file" style="display:none" onchange="changeValue(this);"/>
</form>
<!-- 调取file 框的点击事件 -->
<a href="#" onclick="$('#upload_file').click()">
<!-- 把一个图片当作按钮显示,主要作用就是好看点 -->
<img src="images/jyxc_butll.jpg" type="submit" width="57" height="30" class="jyxc_butll"> <!-- 浏览 -->
</a>
</td>
</tr>
JS
//change事件
function changeValue(e){
var file = e.files[0];
var path=e.value
//给文本框设置文件名称
$("#uploadFile").val(file.name);
// 获取FileList的第一个元素
$.ajaxFileUpload({
url:,//用于文件上传的服务器端请求地址
secureuri:false,//一般设置为false
fileElementId:"upload_file",//文件上传空间的id属性 <input type="file" id="file" name="file" />
dataType: 'json',//返回值类型 一般设置为json
success: function (data){
if(data.success){
URL=data.message;
}else{
alert("图片格式不正确");
}
},
error: function (data)//服务器响应失败处理函数
{
alert("服务器异常");
}
});
};
以上是文件上传的功能,下面是下载!
下载其实超级简单,但是在网上找的信息很多都是不对的 只言片语不知道从哪粘过来的 我也是弄了好长时间才搞定,其实就几行代码
JSP
就是一个a标签
<a href='#' id="lj" ></a>
如果确定路径,及文件名可以这样写 举个栗子
<a href='http://127.0.0.1/test/test/161616116518181.jpg' download="161616116518181.jpg" id="lj" ></a>
这样浏览器就知道是要下载操作了 href 是地址 download 是文件名 ,但是不是所有浏览器都支持 谷歌支持 火狐会打开文件
JS文件
//$("#lj").attr("href",zc+upload);//$("#lj").attr("download",File);
可以留言交流,一起学习