jquery中的ajax异步上传
找了好久终于在网上找到了ajax异步上传文件的方法,不过网上大多数是php的,我改为struts2写的大同小异,希望对学习java的人有一定的帮助。我上传的是音乐文件。
ajaxfileupload.js这个js文件是主要文件,一定要导入。
jsp页面,其中我还做了div的隐藏*****************************
<%@pagelanguage="java"import="java.util.*"pageEncoding="UTF-8"%> <% Stringpath=request.getContextPath(); StringbasePath=request.getScheme()+"://"+request.getServerName()+ ":"+request.getServerPort()+path+"/"; %> <!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"> <html> <head> <basehref="<%=basePath%>"> <title>Uploadify</title> <styletype="text/css"> #div1{ color:#000000;font-size:12px; border:0pxsolid#74B3DC; color:#000; background:#fff; display:none; } </style> <scripttype="text/javascript"src="js/jquery-1.3.2.min.js"></script> <scripttype="text/javascript"src="js/ajaxfileupload.js"></script> <!--执行上传文件操作的函数--> <scripttype="text/javascript"> functionajaxFileUpload(){ $.ajaxFileUpload( { url:'uploadAction.action',//需要链接到服务器地址 secureuri:false, fileElementId:'upload',//文件选择框的id属性 dataType:'json',//服务器返回的格式 success:function(data,status)//相当于java中try语句块的用法 { //alert(data); varss=data; //alert(ss); varmp3Name=ss.split(";"); for(vari=0;i<mp3Name.length;i++){ //alert(mp3Name[i]); $('#songName').val(mp3Name[0]); $('#songsiger').val(mp3Name[1]); } $('#result').html('添加成功'); }, error:function(data,status,e)//相当于java中catch语句块的用法 { //alert("222."); $('#result').html('添加失败'); } } ); target=document.getElementById('div1'); if(target.style.display=="block"){ target.style.display="none"; }else{ target.style.display="block"; } } </script> </head> <body> <formmethod="post"action="uploadAction.action"enctype="multipart/form-data"> <inputtype="file"id="upload"name="upload"/> <inputtype="button"value="上传文档"onclick="ajaxFileUpload()"/> <divid="result"></div> <divid="div1"> 歌曲<inputtype="text"id="songName"name="songName"value=""> 歌手<inputtype="text"id="songsiger"name="songName"value=""> <inputtype="button"value="提交文档信息"/> </div> </form> </body> </html>
action上传后台代码*************************************
packageaction; importjava.io.File; importjava.io.IOException; importjava.io.OutputStream; importorg.apache.commons.io.FileUtils; importorg.apache.struts2.json.annotations.JSON; importorg.farng.mp3.MP3File; importorg.farng.mp3.TagException; importorg.farng.mp3.id3.AbstractID3v2; importorg.farng.mp3.id3.ID3v1; importorg.farng.mp3.lyrics3.AbstractLyrics3; importcom.base.BaseAction; importcom.opensymphony.xwork2.ActionSupport; publicclassUploadextendsBaseAction{ privatestaticfinallongserialVersionUID=-4848248679889814408L; privateStringfileName; privateFileupload; publicFilegetUpload(){ returnupload; } publicvoidsetUpload(Fileupload){ this.upload=upload; } publicvoidsetUploadFileName(StringfileName){ this.fileName=fileName; } /* *歌曲上传上传操作 */ publicvoiduploadAction()throwsIOException{ System.out.println("进入了该方法!"); StringtargetDirectory="D:\\upload"; System.out.println(upload); Filetarget=newFile(targetDirectory,fileName); FileUtils.copyFile(upload,target); Stringpath=targetDirectory+"\\"+fileName; try{ MP3Filefile=newMP3File(path);//1,lyrics AbstractID3v2id3v2=file.getID3v2Tag(); ID3v1id3v1=file.getID3v1Tag(); Stringss=""; if(id3v2!=null){ System.out.println("id3v2"); ss=id3v2.getAlbumTitle()+";"+id3v2.getSongTitle()+";"+id3v2.getLeadArtist(); //Stringstr="{'msg','"+ss+"'}"; Stringstr=ss; outPut(str); System.out.println(id3v2.getAlbumTitle());//专辑名 System.out.println(id3v2.getSongTitle());//歌曲名 System.out.println(id3v2.getLeadArtist());//歌手 }else{ System.out.println("id3v1"); System.out.println(id3v1.getAlbumTitle()); System.out.println(id3v1.getSongTitle()); System.out.println(id3v1.getLeadArtist()); } AbstractLyrics3lrc3Tag=file.getLyrics3Tag(); if(lrc3Tag!=null){ Stringlyrics=lrc3Tag.getSongLyric(); System.out.println(lyrics); } }catch(IOExceptione){ e.printStackTrace(); }catch(TagExceptione){ e.printStackTrace(); } System.out.println("over"); } }
struts.xml配置文件*********************************
<?xmlversion="1.0"encoding="UTF-8"?> <!DOCTYPEstrutsPUBLIC "-//ApacheSoftwareFoundation//DTDStrutsConfiguration2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd"> <struts> <constantname="struts.i18n.encoding"value="UTF-8"/> //设置上传文件最大量 <constantname="struts.multipart.maxSize"value="10485760"/> <packagename="upload"namespace="/"extends="struts-default"> <actionname="uploadAction"class="action.Upload"method="uploadAction"> <resultname="success">/index.jsp</result> </action> </package> </struts>
后来经过调试,发现火狐和ie不兼容导致无执行争取结果,所以我上传ajaxfileupload.js我修改了源码
以上是本文给大家介绍jquery中的ajax异步上传,希望对大家有所帮助。