《jQuery插件AjaxFileUpload实现ajax文件上传_.docx》由会员分享,可在线阅读,更多相关《jQuery插件AjaxFileUpload实现ajax文件上传_.docx(6页珍藏版)》请在三一文库上搜索。
1、jQuery插件AjaxFileUpload实现ajax文件上传_ 本文实例为大家分享了AjaxFileUpload实现文件上传的具体代码,供大家参考,具体内容如下 jQuery插件AjaxFileUpload用来实现ajax文件上传,该插件用法特别简洁,接下来写个demo演示怎么用AjaxFileUpload插件实现文件上传。 1、引入AjaxFileUpload插件相关的js 代码如下: script type=text/javascript src=%=basePath%resources/js/jquery-1.2.1.js/script script type=text/javasc
2、ript src=%=basePath%resources/js/ajaxfileupload.js/script 备注:测试发觉,ajaxfileupload对jQuery版本是有要求的,在用法中ajaxfileupload和jQuery对应的js版本要全都,不然会导致特别发生,可以从ajaxfileupload官网下载,避开版本冲突。 2、实现上传功能代码 % page language=java import=java.util.* pageEncoding=UTF-8% % include file=/base.jsp % % String path = request.getCont
3、extPath(); String basePath = request.getScheme()+:/+request.getServerName()+:+request.getServerPort()+path+/; % !DOCTYPE HTML PUBLIC -/W3C/DTD HTML 4.01 Transitional/EN html head base href=%=basePath% titleajax文件上传/title meta http-equiv=pragma content=no-cache meta http-equiv=cache-control content=n
4、o-cache meta http-equiv=Content-Type content=text/html; charset=UTF-8 meta http-equiv=expires content=0 meta http-equiv=keywords content=keyword1,keyword2,keyword3 meta http-equiv=description content=This is my page link rel=stylesheet type=text/css href=validate/ajaxfileupload.css / script type=tex
5、t/javascript src=validate/jquery-1.6.2.min.js/script script type=text/javascript src=validate/ajaxfileupload.js /script script type=text/javascript $(function() /上传图片 $(#btnUpload).click(function() alert(ajaxFileUpload(); ); ); function ajaxFileUpload() / 开头上传文件时显示一个图片 $(#wait_loading).ajaxStart(fun
6、ction() $(this).show(); / 文件上传完成将图片隐蔽起来 ).ajaxComplete(function() $(this).hide(); ); var elementIds=flag; /flag为id、name属性名 $.ajaxFileUpload( url: uploadAjax.htm, type: post, secureuri: false, /一般设置为false fileElementId: file, / 上传文件的id、name属性名 dataType: text, /返回值类型,一般设置为json、application/json element
7、Ids: elementIds, /传递参数到服务器 success: function(data, status) alert(data); , error: function(data, status, e) alert(e); ); /return false; /script /head body div id=wait_loading style=padding: 50px 0 0 0;display:none; div style=width: 103px;margin: 0 auto;img src=%=path %/images/loading.gif/div br/br div style=width: 103px;margin: 0 auto;span请稍等./span/div br/br /div input type=file id=file name=filebr/ input type=hidden id=flag name=flag value=ajax文件上传/ input type=button id=btnUpload value=上传图片 / /body /html 以上就是本文的全部内容,盼望对大家学习jquery程序设计有所关心。 .