ajaxFileUpload上传图片

jsp页面

<div class="picture">

<input id="uid" type="hidden">

input type="file" name="file" id="fn" onchange="select_img();">

<img id='target' class="popup" style="width:143px;height:190px;display:none;" />

引用的js

jquery.ajaxfileupload.js

js代码


$(function () {

$('input[type=text]').validatebox();

});

function uploadP(id){

$("#uid").val(id);

$("#uploadpictrue").dialog("open");

}

function select_img() {

var id=$("#uid").val();

var value = $("#fn").val();

var ext = value.substring(value.lastIndexOf(".") + 1).toLowerCase();

if (ext == null

|| ext == ""

|| (ext != "jpg" && ext != "gif" && ext != "bmp" && ext != "jpeg" && ext != "png")) {

$.messager.alert("操作提示","图片格式错误","info");

} else{

$.ajaxFileUpload({

url : "<%=basePath%>uploadImgFile.html?id="+id,

secureuri : false,// 一般设置为false

fileElementId : 'fn',// 文件上传空间的id属性

dataType : 'text',// 返回值类型 一般设置为json

success : function(data,status) // 服务器成功响应处理函数

{

var path=data.substring(8,data.length-3);

if(path=="fail1"){

$("#fn").val("");

$.messager.alert("操作提示","文件超过4MB,请您重新上传","info");

}else{

$("#target").attr("src",getRootPath() + data);

$("#btnl").css("display","block");

$("#target").css("display","block");

}

},


error : function(data,status,e)// 服务器响应失败处理函数

{

$.messager.alert("操作提示",e,"info");

}

});

}

}

function getRootPath() {

// 获取当前网址,如: http://localhost:8083/uimcardprj/share/meun.jsp

var curWwwPath = window.document.location.href;

// 获取主机地址之后的目录,如: uimcardprj/share/meun.jsp

var pathName = window.document.location.pathname;

var pos = curWwwPath.indexOf(pathName);

// 获取主机地址,如: http://localhost:8083

var localhostPaht = curWwwPath.substring(0,pos);

// 获取带"/"的项目名,如:/uimcardprj

var projectName = pathName

.substring(0,pathName.substr(1).indexOf('/') + 1);

return (localhostPaht + projectName) + "/";

}


后台代码

@SuppressWarnings("unchecked")

@RequestMapping(value = "/uploadImgFile.html")

public @ResponseBody void uploadImgFile(HttpServletRequest request,

HttpServletResponse response,

@RequestParam("file") MultipartFile file,int id)

throws Exception {

JSONObject jsonObject=new JSONObject();

//文件大小

double fileSizeDouble = get2Double(((double) file.getSize() / 1024) / 1024);

String fileSize = fileSizeDouble + "MB";

if (fileSizeDouble > 4.0) {

jsonObject.put("msg","fail1");

// ResponseUtil.write(response,jsonObject);

}else {

String sql="from TabExpert te where te.expertid='"+id+"'";

TabExpert tabExpert=tabExpertSercive.getTabExpertListByHql(sql).get(0);

String msg="";

// 获取当期时间,作为文件名,避免重复

SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMdd");

String fileTime = sdf.format(new Date());


String fileName = file.getOriginalFilename();

System.out.println(fileName);

String type = fileName.substring(fileName.lastIndexOf(".") + 1);

/*if (fileName.length() > 0) {

if (!type.equals("jpg") && !type.equals("bmp")

&& !type.equals("gif") && !type.equals("png")

&& !type.equals("jpeg")) {

jsonObject.put("msg","图片格式错误");

}

}else{

*/

// 上传的文件放在“realPath”目录下

String realPath1 = request.getSession().getServletContext()

.getRealPath("houtai/image/" + fileTime);

if ((new File(realPath1).isDirectory())) {

System.out.println("文件夹已存在!创建失败!");


} else {

new File(realPath1).mkdir();

System.out.println("创建文件夹成功!");


}


if (fileName.length() > 0) {

// 存入照片

FileUtils.copyInputStreamToFile(file.getInputStream(),new File(

realPath1,fileName));

// 相片路径

String realPath = realPath1 + "\\" + fileName;


System.out.println("========================================");


// 将文件名存入数据库

// realPath=realPath+"\\"+fileName;

int beginIndex = realPath.lastIndexOf("houtai");

realPath = realPath.substring(beginIndex,realPath.length());

tabExpert.setExt0(realPath.replace("\\","/"));

tabExpert.setExt1(fileName);

try {

tabExpertSercive.updateTabExpert(tabExpert);

msg=tabExpert.getExt0();

ResponseUtil.write(response,msg);

jsonObject.put("msg",tabExpert.getExt0());

System.out.println(tabExpert.getExt0());

} catch (Exception e) {

// TODO: handle exception

jsonObject.put("msg","上传失败!");

}

}

/*}*/

}

ResponseUtil.write(response,jsonObject);

}

相关文章

$.AJAX()方法中的PROCESSDATA参数 在使用jQuery的$.ajax()方...
form表单提交的几种方式 表单提交方式一:直接利用form表单提...
文章浏览阅读1.3k次。AJAX的无刷新机制使得在注册系统中对于...
文章浏览阅读1.2k次。 本文将解释如何使用AJAX和JSON分析器在...
文章浏览阅读2.2k次。/************************** 创建XML...
文章浏览阅读3.7k次。在ajax应用中,通常一个页面要同时发送...