jquery+ajaxfileupload+struts2完整实例
来源:互联网 发布:java如何调用一个方法 编辑:程序博客网 时间:2024/06/06 14:20
这两天支撑另外一个项目组,需要修改两个功能页面,其中涉及到要做ajax异步上传图片,在网上找了不少资料,但是发现ajaxfileupload.js在返回json对象时会给json结果加一个<pre></pre>框.使得返回结果对json的解析不正确,这样就会出现网上大多数人出现的,ajax请求总是返回到error里面,并且报异常。后来找js高手帮忙修改ajaxfileupload.js文件后完成该功能。
实现步骤:
重点是先修改ajaxfileupload.js文件:
if ( type == "json" )
var str = r.responseText.toString();
return str.substring(str.indexOf("{"),str.indexOf("}")+1)
jsp页面
<script type="text/javascript" src="*/jquery-1.8.0.min.js"></script><script type="text/javascript" src="*/ajaxfileupload.js"></script>
<input id="file" name="file" domName="图片信息" type="file" class="txt w250" onchange="ajaxFileUpload(this)"></input><input type="hidden" id="imageUrl" name="imageUrl" value=""/>
js:
function ajaxFileUpload(obj){var tmpFilePath = obj.value; alert(obj.value);if(validateImage(obj)) { $.ajaxFileUpload( { url: $("#contextPathId").val() + "/broadband/fileUploadAction.action?num="+Math.random(), //需要链接到服务器地址 secureuri:false, fileElementId:'file', //文件选择框的id属性 dataType: 'json', //服务器返回的格式,可以是json success: function (json) //服务器成功响应处理函数 { json = jQuery.parseJSON(json); //jquery解析Json对象 document.getElementById("imageUrl").value=json.data; alert("文件上传成功");//从服务器返回的json中取出message中的数据,其中message为在struts2中定义的成员变量 }, error: function (data,status,e)//服务器响应失败处理函数 { alert("文件上传失败"); } }); } }function validateImage(obj) { var file = obj; var tmpFileValue = file.value; //校验图片格式 if(/^.*?\.(gif|png|jpg|jpeg|bmp)$/.test(tmpFileValue.toLowerCase())){ return true; } else { alert("只能上传jpg、jpeg、png、bmp或gif格式的图片!"); return false; } }后台处理接收数据时需要配置struts.xml文件单独配置<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd"><struts> <package name="struts-fileupload" extends="json-default" namespace="/broadband"> <action name="fileUploadAction" class="com.sxit.web.broadband.action.BroadbandAction" method="uploadImage"> <result type="json" name="success"> <param name="contentType">text/html</param> </result> <result type="json" name="error"> <param name="contentType">text/html</param> </result> </action> </package> </struts>action处理方法:private File file; //注意file名与表单name对应 private String fileFileName; //file+FileName为固定写法,否则取不到 private String fileContentType; //file+ContentType为固定写法/*** * 上传图片信息 * @return * @throws Exception */public String uploadImage() throws Exception{ String path = SystemConfig.getFrontHotModelPath(); System.out.println(path+"============================="); File file = new File(path);// JSON消息JSONMessage msg = new JSONMessage();if(!file.exists()){file.mkdirs();} File f = this.getFile(); if(this.getFileFileName().endsWith(".exe")){ this.message="上传文件格式不正确,请重新选择!"; msg.setSuccess(false); msg.setMessage("上传文件格式不正确,请重新选择!"); return ERROR; } FileInputStream inputStream = new FileInputStream(f); String filename=System.currentTimeMillis() + "." +FilenameUtils.getExtension(this.getFileFileName()); FileOutputStream outputStream = new FileOutputStream(path+"images/Broadband/big/"+ filename); byte[] buf = new byte[1024]; int length = 0; while ((length = inputStream.read(buf)) != -1) { outputStream.write(buf, 0, length); } this.setFileUrl("../images/Broadband/big/"+ filename); msg.setSuccess(true); msg.setMessage("上传文件成功!"); msg.setData(this.getFileUrl()); inputStream.close(); outputStream.flush(); super.getRequest().setCharacterEncoding("UTF-8"); super.getResponse().setCharacterEncoding("UTF-8"); super.getResponse().getWriter().println(msg.toJSONObject()); return SUCCESS;}setter和getter
加上ss2h框架和json解析以及需要的js文件。
- jquery+ajaxfileupload+struts2完整实例
- 在struts2中使用jQuery插件ajaxfileupload
- 整合 jquery ajaxfileupload 文件异步上传实例
- Struts2 +jquery+ajaxfileupload 实现无刷新上传文件
- Struts2 +jquery+ajaxfileupload 实现无刷新上传图片
- Struts2 +jquery+ajaxfileupload 实现无刷新上传文件
- Struts2+JQuery+Json实例
- Struts2+JQuery+Json实例
- Struts2+JQuery+Json实例
- Struts2+JQuery+Json实例
- Struts2+JQuery+Json实例
- Struts2+JQuery+Json实例
- struts2中运用json的完整实例
- Struts2 + uploadify 多文件上传完整实例!
- struts2中运用json的完整实例
- Spring整合Struts2步骤及完整实例
- struts2中运用json的完整实例
- 完整的struts2框架应用实例
- 连接池配置-tomcat
- android 国际化
- Android去掉标题的方法
- ABAP "FOR ALL ENTRIES IN"
- HTML5 AND HTML4 标签对比
- jquery+ajaxfileupload+struts2完整实例
- 关于SQL语句中日期的处理to_date()的应用
- 区域网内两台电脑之间的访问问题
- hdu 1058 Humble Numbers (dp)
- gcc编译冒泡法和vc编译的不同
- 高斯消元-解线性方程(模板)
- VC中MFC check box的用法
- 华为招聘-C语言笔试试题及答案
- Div+Css 常用样式全面整理