找了好久終于在網(wǎng)上找到了ajax異步上傳文件的方法,不過(guò)網(wǎng)上大多數(shù)是php的 ,我改為struts2寫(xiě)的 大同小異,希望對(duì)學(xué)習(xí)java的人有一定的幫助。我上傳的是音樂(lè)文件。
ajaxfileupload.js這個(gè)js文件是主要文件,一定要導(dǎo)入。
jsp頁(yè)面 ,其中我還做了div的隱藏*****************************
%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+
":"+request.getServerPort()+path+"/";
%>
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
html>
head>
base href="%=basePath%>">
title>Uploadify/title>
style type="text/css">
#div1{
color: #000000; font-size: 12px;
border: 0px solid #74B3DC;
color: #000;
background: #fff;
display:none;
}
/style>
script type="text/javascript" src="js/jquery-1.3.2.min.js">/script>
script type="text/javascript" src="js/ajaxfileupload.js">/script>
!-- 執(zhí)行上傳文件操作的函數(shù) -->
script type="text/javascript">
function ajaxFileUpload(){
$.ajaxFileUpload(
{
url:'uploadAction.action', //需要鏈接到服務(wù)器地址
secureuri:false,
fileElementId:'upload', //文件選擇框的id屬性
dataType: 'json', //服務(wù)器返回的格式
success: function (data, status) //相當(dāng)于java中try語(yǔ)句塊的用法
{
// alert(data);
var ss =data;
// alert(ss);
var mp3Name = ss.split(";");
for(var i=0; imp3Name.length;i++) {
//alert(mp3Name[i]);
$('#songName').val(mp3Name[0]);
$('#songsiger').val(mp3Name[1]);
}
$('#result').html('添加成功');
},
error: function (data, status, e) //相當(dāng)于java中catch語(yǔ)句塊的用法
{
//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>
form method="post" action="uploadAction.action" enctype="multipart/form-data">
input type="file" id="upload" name="upload"/>
input type="button" value="上傳文檔" onclick="ajaxFileUpload()"/>
div id="result">/div>
div id="div1">
歌曲input type="text" id="songName" name="songName" value="">
歌手 input type="text" id="songsiger" name="songName" value="">
input type="button" value="提交文檔信息" />
/div>
/form>
/body>
/html>
action上傳后臺(tái)代碼*************************************
package action;
import java.io.File;
import java.io.IOException;
import java.io.OutputStream;
import org.apache.commons.io.FileUtils;
import org.apache.struts2.json.annotations.JSON;
import org.farng.mp3.MP3File;
import org.farng.mp3.TagException;
import org.farng.mp3.id3.AbstractID3v2;
import org.farng.mp3.id3.ID3v1;
import org.farng.mp3.lyrics3.AbstractLyrics3;
import com.base.BaseAction;
import com.opensymphony.xwork2.ActionSupport;
public class Upload extends BaseAction {
private static final long serialVersionUID = -4848248679889814408L;
private String fileName;
private File upload;
public File getUpload() {
return upload;
}
public void setUpload(File upload) {
this.upload = upload;
}
public void setUploadFileName(String fileName) {
this.fileName = fileName;
}
/*
* 歌曲上傳 上傳操作
*/
public void uploadAction() throws IOException {
System.out.println("進(jìn)入了該方法!");
String targetDirectory = "D:\\upload";
System.out.println(upload);
File target = new File(targetDirectory, fileName);
FileUtils.copyFile(upload, target);
String path = targetDirectory+"\\"+fileName;
try {
MP3File file = new MP3File(path);//1,lyrics
AbstractID3v2 id3v2 = file.getID3v2Tag();
ID3v1 id3v1 = file.getID3v1Tag();
String ss = "";
if (id3v2 != null) {
System.out.println("id3v2");
ss = id3v2.getAlbumTitle()+";"+id3v2.getSongTitle()+";"+id3v2.getLeadArtist();
//String str = "{'msg','"+ss+"'}";
String str = ss;
outPut(str);
System.out.println(id3v2.getAlbumTitle());//專(zhuān)輯名
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());
}
AbstractLyrics3 lrc3Tag = file.getLyrics3Tag();
if (lrc3Tag != null) {
String lyrics = lrc3Tag.getSongLyric();
System.out.println(lyrics);
}
} catch (IOException e) {
e.printStackTrace();
} catch (TagException e) {
e.printStackTrace();
}
System.out.println("over");
}
}
struts.xml配置文件*********************************
?xml version="1.0" encoding="UTF-8" ?>
!DOCTYPE struts PUBLIC
"-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
"http://struts.apache.org/dtds/struts-2.0.dtd">
struts>
constant name="struts.i18n.encoding" value="UTF-8"/>
//設(shè)置上傳文件最大量
constant name="struts.multipart.maxSize" value="10485760"/>
package name="upload" namespace="/" extends="struts-default" >
action name="uploadAction" class="action.Upload" method="uploadAction">
result name="success">/index.jsp/result>
/action>
/package>
/struts>
后來(lái)經(jīng)過(guò)調(diào)試,發(fā)現(xiàn)火狐和ie不兼容 導(dǎo)致無(wú)執(zhí)行爭(zhēng)取結(jié)果,所以我上傳ajaxfileupload.js 我修改了源碼
以上是本文給大家介紹jquery中的ajax異步上傳,希望對(duì)大家有所幫助。
您可能感興趣的文章:- ajax實(shí)現(xiàn)異步文件或圖片上傳功能
- ajax圖片上傳,圖片異步上傳,更新實(shí)例
- ajax 異步上傳帶進(jìn)度條視頻并提取縮略圖
- Ajax異步文件上傳與NodeJS express服務(wù)端處理
- Ajax異步上傳文件實(shí)例代碼分享
- ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能示例
- Ajax表單異步上傳文件實(shí)例代碼(包括文件域)
- 表單上傳功能實(shí)現(xiàn) ajax文件異步上傳
- ajax異步實(shí)現(xiàn)文件分片上傳實(shí)例代碼