uploadify 是一款不错的ajax上传文件的jQuery插件。
官方网站为:http://www.uploadify.com
1,下载开发包:jquery.uploadify-v2.1.0 ,目前最高版本为2.1.0
2,解压开发包。将
jquery-1.3.2.min.js,
jquery.uploadify.v2.1.0.min.js,
swfobject.js,
uploadify.swf,
uploadify.css,
cancel.png
六个文件添加到项目的对应路径中。
3,jsp页面
<link rel="stylesheet" type="text/css" href="uploadify/uploadify.css">
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="uploadify/swfobject.js"></script>
<script type="text/javascript" src="uploadify/jquery.uploadify.v2.1.0.min.js"></script>
<!--代码省略-->
<input type='file' name='logoImg' id="logoImg" >
4,相应的js代码
$(document).ready(function(){
$("#logoImg").uploadify({
'uploader' : 'uploadify/uploadify.swf',//设置uploadify.swf的路径。
'script' : 'faceSet_doUploadFile.action',//请求响应的Action。
'cancelImg' : 'uploadify/cancel.png',//设置 取消按钮图片的路径。
'folder' : '/',//设置上传文件后保存的路径。
'fileDataName' : 'logoImg',
'displayData' : 'percentag',
'auto' : true,//设置是否自动上传。
'multi' : false,//设置是否多文件上传。
'onComplete' :function(event,queueId,fileObj,response){
//因为传回的数据时字符串,通过eval方法将其转化成JSON格式。
var jsonObject=eval('('+response+')');
var fileName=jsonObject.fileName;//得到回调的图片的路径。
$("#faceSetImg").attr("src","../"+fileName+"?now="+new Date());
$("#imgShow").show();
$("#fileShow").hide();
},
'onError' :function(event,queueID,fileObj,errorObj){
alert("Ajax上传图片出错!请重新试过!");
}
});
});
5,struts.xml的配置文件
<action name="faceSet_*" class="org.cric.action.systemset.FaceSetAction" method="{1}">
<result name="jsonback" type="json">
<param name="includeProperties">
fileName
</param>
</result>
</action>
6,Action类的写法
private File logoImg;//上传的文件的File名称。
private String logoImgFileName;//该文件的文件名称
private String logoImgContentType;//该文件的文件类型
//省略Setter ,Getter方法。
public String doUploadFile()throws Exception{//ajax 上传文件.
String path=ServletActionContext.getServletContext().getRealPath("/");//得到跟路径。
String fileName=this.faceSetServiceImpl.uploadImg(path, this.getLogoImg(), IMGNAME);
this.setFileName(fileName);
return "jsonback";
}
我使用了json插件来作为Ajax前后台媒介的交换格式!!
分享到:
相关推荐
(3) **整合jQuery插件**:Struts2有专门的jQuery插件,它可以简化Ajax请求和动态加载内容。将Struts2 jQuery插件添加到项目,并在页面中引入相关的JavaScript和CSS资源。 ```html <script src="/struts/js/jquery....
struts2的jquery插件, 可使用jquery标签库快速进行前端开发。
将jQuery与Struts2结合,可以实现前后端的无缝交互,提高应用程序的用户体验。 ### jQuery简介 jQuery的核心理念是"Write Less, Do More",它的API设计简洁明了,使得开发者能够用更少的代码完成更多的任务。...
struts2-jquery插件源码。版本号3.0.1
Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON Struts2 Jquery JSON
在探讨Struts2与jQuery插件的结合时,我们深入分析了如何在Struts2框架中集成并利用jQuery插件来增强Web应用程序的交互性和用户体验。Struts2作为一个流行的Java Web开发框架,提供了一种灵活的方式来构建MVC架构的...
jQuery插件flexBox的应用ⅡjQuery插件flexBox的应用ⅡjQuery插件flexBox的应用ⅡjQuery插件flexBox的应用ⅡjQuery插件flexBox的应用ⅡjQuery插件flexBox的应用Ⅱ
- struts2-json-plugin-2.1.8.jar:Struts2的JSON插件,用于JSON数据交换 **2. Struts2 Action类** 创建一个Struts2的Action类,例如`MyAjaxAction`,用于接收前端提交的数据并返回结果。在这个例子中,我们有两个...
Struts2则是一个基于MVC(Model-View-Controller)架构的Java Web框架,它由原来的Struts1发展而来,提供了更强大的功能和灵活性,包括拦截器、插件体系和OGNL表达式语言等,使开发者能够构建结构清晰、可测试性强的...
总结来说,实现“jQuery Java Struts2 实现分页”涉及到前后端的协同工作:前端使用jQuery和其分页插件处理用户交互,样式通过CSS自定义;后端使用Java和Struts2框架处理分页逻辑,与数据库进行交互,返回所需数据。...
jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....
3. **编写jQuery代码**:在客户端,使用jQuery的`.ajax()`方法或者其他Struts2 jQuery插件提供的标签,创建一个Ajax请求,指向服务器上的Struts2 Action。 4. **处理服务器响应**:在Action中,执行必要的业务逻辑...
标题中的“省市联动jQuery+Struts2”是指...这个功能结合了jQuery的前端交互优势和Struts2的后端控制能力,使得Web应用更加动态、响应快速。在实际项目中,还可以考虑添加错误处理、数据缓存等优化措施,提高用户体验。
2. **Struts2的插件支持**:Struts2社区提供了jQuery插件,使得使用jQuery更加方便。例如,`struts2-jquery-plugin`提供了许多预定义的jQuery UI组件,如日期选择器、下拉菜单等,只需简单的标签即可实现。 3. **...
在IT行业中,网页开发是一项核心任务,而jQuery和Struts2是两个常用的技术框架,用于增强用户界面交互和构建后端逻辑。在这个“jQuery+struts2翻页实现”的项目中,我们将深入探讨如何结合这两个工具来实现动态的...
jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...
这是一款应用jQuery加struts2框架实现的javamail邮件接发系统,其中可以实现与163,qq,sina等主流邮箱的的发送与接收邮件,对于你学习javamail,应用jQuery和struts2框架具用很好的借鉴作用...
在本文中,我们将深入探讨如何使用jQuery和Struts2框架实现文件上传功能。这是一个常见的需求,在Web应用中,用户可能需要上传图片、文档等文件。jQuery是一个轻量级的JavaScript库,提供了丰富的交互效果和API,而...
将jQuery与Struts2结合,可以构建出强大的Web应用。前端使用jQuery处理用户交互和异步请求,后端使用Struts2处理业务逻辑并返回数据。这种组合使得开发人员能更专注于业务逻辑,同时保持良好的用户体验。例如,使用...
《jQuery Validate与Struts2整合应用详解》 在Web开发中,前端验证用户输入的数据是必不可少的一环,jQuery Validate插件就是一款强大的JavaScript验证工具,它可以帮助我们方便地实现表单验证。与此同时,Struts2...