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异步上传,希望对大家有所帮助。