1、js代码:
<script type="text/javascript">
$(document).ready(function() {
$('#fileInput').uploadify({
//以下参数均是可选
'uploader' : '<%=basePath%>images/uploadify.swf', //指定上传控件的主体文件,默认‘uploader.swf’
'script' : '<%=basePath%>UploadServlet', //指定服务器端上传处理文件,默认‘upload.php’
'cancelImg' : '<%=basePath%>images/cancel.png', //指定取消上传的图片,默认‘cancel.png’
'buttonImg':'<%=basePath%>images/upload2.jpg',
'auto' : true, //选定文件后是否自动上传,默认false
'folder' : '/userphoto' , //要上传到的服务器路径,默认‘/’
'multi' : false, //是否允许同时上传多文件,默认false
'fileDesc' : '图片文件' , //出现在上传对话框中的文件类型描述
'fileExt' : '*.jpg;*.bmp;*.png;*.gif', //控制可上传文件的扩展名,启用本项时需同时声明fileDesc
'sizeLimit': 86400, //控制上传文件的大小,单位byte
'onComplete': function(event,queueID,fileObj,response,data) {
$('#image').attr("src","<%=basePath%>userphoto/"+response);
$('#image').show();
$('#photo').attr("value",response);
},
'onError' : function(event, queueID, fileObj)
{
alert("文件:" + fileObj.name + " 上传失败");
}
});
});
</script>
2、注意事项
(1)、如果页面没有显示“BROWSE”按钮,则说明你的'uploader' : '<%=basePath%>images/uploadify.swf'配置不对,检查下路径是否正确。
(2)、如果需要修改按钮的图片:可以使用'buttonImg'配置进行替换
(3)、上传完成后,'onComplete'事件没有触发:在后台servlet处理完后,要向页面输出1,否则页面的onComplete回 调函数不会执行。response.getWriter().write(1);
(4)、如果在后台servlet处理上传将图片的名称改变的话,就不能通过fileObj获得它的值,而是要在后台servlet输出新文件 名:out.print(filename);在jsp页面要相应使用response来获得新值。
(5)、图片预览实现:
在jsp页面中添加一个<img src=""></img>,当上传完成后在onComplete事件中修改img的src值。
3、下载地址
www.uploadify.com/download/
- 浏览: 191624 次
- 性别:
- 来自: 北京
最新评论
-
xiebo1983:
http://www.sqkoo.com/show/detai ...
完美解决MySQL中文乱码 -
hzy888:
楼主,你好,你说的问题,我自己写例子测试,没有你说的效果,两个 ...
onblur和onclick冲突 -
ahack:
onblur 谢谢。
onblur和onclick冲突 -
lkf009:
an_it_eye_2012 写道降下来了,怎么再升上去呢,需 ...
Windows IE8降为IE6 -
haohao-xuexi02:
貌似这个方法不错啊
Windows IE8降为IE6
jquery.uploadify插件实现图片上传和预览效果
- 博客分类:
- javascript
相关推荐
uploadfiy这个插件是基于js里面的jquery库写的。结合了ajax和flash,实现了这个多线程上传的功能。
给予jQuery的文件上传插件:jquery.uploadify.js修复了IE9 IE10浏览按钮点击无效的bug;直接替换官网下载的jquery.uploadify.js文件即可使用。
jquery.uploadify-3.1.min.js 修改了SWFUpload.prototype.getFlashHTML ()方法,解决了在ie9在点击上传按钮后,不能弹出浏览文件的对话框问题。
解决 jquery.uploadify.js 在ie9 下 二次打开失效问题等问题
该uploadify为目前官网最新版本,由鄙人修改后,可以支持buttonText属性为中文
jquery.uploadify.v2.1.0.js 上传
Asp.net 上传 Jquery.Uploadify HTML控件+Jquery.Uploadify 支持一次上传多个文件
ASP.NET jquery.uploadify文件上传控件测试项目(已解决中文乱码)
jquery文件上传插件 jquery.uploadify.js 不支持IE10现在经过修改,已经支持IE6、IE7、IE8、IE9、IE10、IE11.zip
采用jquery.uploadify插件作为前台上传,服务台用c#异步处理
最近调试成功了jquery下的uploadify文件上传,包括fileExt,onComplete,onAllComplete等参数使用,里边有个说明,详细介绍各参数。
jquery uploadify插件Demo
struts2+jquery.uploadify实现上传下载
jquery.uploadify-v2.1.4上传完整例子,很好用,很方便,很经典。
jquery.cropzoom与jquery.uploadify,实现图片无刷新上传和放大剪裁,难点在于接受cropzoom传来的前台参数,通过对原图片的旋转放大复现前台拖放效果,后台图片操作代码用java语言实现,附件为myeclipse8.5工程,导入...
jquery.uploadify上传图片工具。。 很好很强大..如需详解请联系本人
jquery文件上传插件 jquery.uploadify.js 不支持IE10现在经过修改,已经支持IE6、IE7、IE8、IE9、IE10、IE11.zip
Uploadify html5 官网下载 竟然要收费,太可气了,这个是根据官网API做的和uploadify一样基于html5 的上传插件。部署很简单。
jquery_uploadify_v3.2版 jquery.uploadify.js 英文提示汉化
Uploadify的用法就不说了,网上文章很多,跟别的jquery插件用法一样,就是几种文件的摆放路径而已。具体的压缩包里有说明文件