㈠ jquery怎么上传多个文件上传
jquery有个插件叫uploadify
http://www.uploadify.com/
$(function() { $("#file_upload_1").uploadify({ height : 30, swf : '/uploadify/uploadify.swf', uploader : '/uploadify/uploadify.php', width : 120 });});
㈡ 怎么样通过jQuery Ajax实现上传文件
Query Ajax在web应用开发中很常用，它主要包括有ajax,get,post,load,getscript等等这几种常用无刷新操作方法，接下来通过本文给大家介绍jquery ajax 上传文件处理方式。
FormData对象
XMLHttpRequest Level 2添加了一个新的接口FormData.利用FormData对象,我们可以通过JavaScript用一些键值对来模拟一系列表单控件,我们还可以使用XMLHttpRequest的send()方法来异步的提交这个”表单”.比起普通的ajax,使用FormData的最大优点就是我们可以异步上传一个二进制文件.
所有主流浏览器的较新版本都已经支持这个对象了，比如Chrome 7+、Firefox 4+、IE 10+、Opera 12+、Safari 5+。之前都是用原生js的XMLHttpRequest写的请求
XMLHttpRequest方式
xhr.open("POST", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
// Handle response.
alert(xhr.responseText); // handle response.
}
};
fd.append('myFile', file);
// Initiate a multipart/form-data upload
xhr.send(fd);
其实jquery的ajax也可以支持到的，关键是设置：processData 和 contentType 。
ajax方式
var formData = new FormData();
var name = $("input").val();
formData.append("file",$("#upload")[0].files[0]);
formData.append("name",name);
$.ajax({
url : Url,
type : 'POST',
data : formData,
// 告诉jQuery不要去处理发送的数据
processData : false,
// 告诉jQuery不要去设置Content-Type请求头
contentType : false,
beforeSend:function(){
console.log("正在进行，请稍候");
},
success : function(responseStr) {
if(responseStr.status===0){
console.log("成功"+responseStr);
}else{
console.log("失败");
}
},
error : function(responseStr) {
console.log("error");
}
});
㈢ jQuery实现文件上传。
/*jQuery实现文件上传，参考例子如下：
packagecom.kinth.hddpt.file.action;
importjava.io.File;
importjava.io.FileNotFoundException;
importjava.io.FileOutputStream;
importjava.io.IOException;
importjava.io.InputStream;
importjava.io.OutputStream;
importjava.util.ArrayList;
importjava.util.Calendar;
importjava.util.Enumeration;
importjava.util.Hashtable;
importjava.util.List;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
importnet.sf.json.JSONArray;
importorg.apache.commons.logging.Log;
importorg.apache.commons.logging.LogFactory;
importorg.apache.struts.action.ActionForm;
importorg.apache.struts.action.ActionForward;
importorg.apache.struts.action.ActionMapping;
importorg.apache.struts.upload.FormFile;
importorg.hibernate.criterion.MatchMode;
importorg.hibernate.criterion.Order;
importorg.hibernate.criterion.Restrictions;
importcom.gdcn.bpaf.common.base.search.MyCriteria;
importcom.gdcn.bpaf.common.base.search.MyCriteriaFactory;
importcom.gdcn.bpaf.common.base.service.BaseService;
importcom.gdcn.bpaf.common.helper.PagerList;
importcom.gdcn.bpaf.common.helper.WebHelper;
importcom.gdcn.bpaf.common.taglib.SplitPage;
importcom.gdcn.bpaf.security.model.LogonVO;
importcom.gdcn.components.appauth.common.helper.DictionaryHelper;
importcom.kinth.common.base.action.BaseAction;
importcom.kinth.hddpt.file.action.form.FileCatalogForm;
importcom.kinth.hddpt.file.model.FileCatalog;
importcom.kinth.hddpt.file.service.FileCatalogService;
importcom.kinth.hddpt.file.util.MyZTreeNode;
/**
*<p>
*description:“文件上传的Struts层请求处理类”
*</p>
*@date:2013-1-14
*/
<FileCatalog>{
@SuppressWarnings("unused")
privatestaticLoglog=LogFactory.getLog(FileCatalogAction.class);//日志记录
;
//删除记录的同时删除相应文件
publicActionForwardfileDelete(ActionMappingmapping,ActionFormform,
HttpServletRequestrequest,HttpServletResponseresponse)
throwsException{
String[]id=request.getParameterValues("resourceId");
if(id!=null&&id[0].contains(",")){
id=id[0].split(",");
}
String[]fileUrls=newString[id.length];
for(intj=0;j<id.length;j++){
fileUrls[j]=fileCatalogService.findObject(id[j]).getFileUrl();
if(!isEmpty(fileUrls[j])){
//如果该文件夹不存在则创建一个uptext文件夹
Filefileup=newFile(fileUrls[j]);
if(fileup.exists()||fileup!=null){
fileup.delete();
}
}
fileCatalogService.deleteObject(id[j]);
}
setAllActionInfos(request);
returnlist(mapping,form,request,response);
}
@Override
publicActionForwardsave(ActionMappingmapping,ActionFormform,
HttpServletRequestrequest,HttpServletResponseresponse)
throwsException{
Stringid=request.getParameter("resourceId");
BooleanfileFlag=Boolean.valueOf(request.getParameter("fileFlag"));
if(fileFlag!=null&&fileFlag==true){
returnsuper.save(mapping,form,request,response);
}else{
StringfileUrl=this.fileUpload(form,request,id,fileFlag);
response.setContentType("text/html");
response.setCharacterEncoding("GBK");
response.setHeader("Charset","GBK");
response.setHeader("Cache-Control","no-cache");
response.getWriter().write(fileUrl);
response.getWriter().flush();
}
returnnull;
}
@SuppressWarnings("unchecked")
publicStringfileUpload(ActionFormform,HttpServletRequestrequest,Stringid,BooleanfileFlag)throwsFileNotFoundException,IOException{
request.setCharacterEncoding("GBK");
StringbasePath=getServlet().getServletConfig().getServletContext().getRealPath("")+"/";
StringfilePath="uploads/";//获取项目根路径;
/*注释部分对应jqueryuploaploadify插件的后台代码,只是还存在编码问题，默认为utf-8
StringsavePath=getServlet().getServletConfig().getServletContext().getRealPath("");//获取项目根路径
savePath=savePath+"\uploads\";
//读取上传来的文件信息
Hashtable<String,FormFile>fileHashtable=form.getMultipartRequestHandler().getFileElements();
Enumeration<String>enumeration=fileHashtable.keys();
enumeration.hasMoreElements();
Stringkey=(String)enumeration.nextElement();
FormFileformFile=(FormFile)fileHashtable.get(key);
Stringfilename=formFile.getFileName().trim();//文件名
filename=newEncodeChange().changeCode(filename);
Stringfiletype=filename.substring(filename.lastIndexOf(".")+1);//文件类型
savePath=savePath+filetype+"\";
System.out.println("path:"+savePath);
StringrealPath=savePath+filename;//真实文件路径
//如果该文件夹不存在则创建一个文件夹
Filefileup=newFile(savePath);
if(!fileup.exists()||fileup==null){
fileup.mkdirs();
}
if(!filename.equals("")){
//在这里上传文件
InputStreamis=formFile.getInputStream();
OutputStreamos=newFileOutputStream(realPath);
intbytesRead=0;
byte[]buffer=newbyte[8192];
while((bytesRead=is.read(buffer,0,8192))!=-1){
os.write(buffer,0,bytesRead);
}
os.close();
is.close();
//如果是修改操作，则删除原来的文件
Stringid=request.getParameter("resourceId");
if(!isEmpty(id)){
FileCatalogfileCatalog=fileCatalogService.findObject(id);
StringfileUrl=fileCatalog.getFileUrl();
if(!isEmpty(fileUrl)){
Filefiledel=newFile(fileUrl);
if(filedel.exists()||filedel!=null){
filedel.delete();
}
}
request.setAttribute("entity",fileCatalog);
}
response.getWriter().print(realPath);//向页面端返回结果信息
}*/
//读取上传来的文件信息
Hashtable<String,FormFile>fileHashtable=form.getMultipartRequestHandler().getFileElements();
Enumeration<String>enumeration=fileHashtable.keys();
enumeration.hasMoreElements();
Stringkey=(String)enumeration.nextElement();
FormFileformFile=(FormFile)fileHashtable.get(key);
Stringfilename=formFile.getFileName().trim();//文件名
Stringfiletype=filename.substring(filename.lastIndexOf(".")+1);//文件类型
IntegerfileSize=formFile.getFileSize();
filePath+=Calendar.getInstance().get(Calendar.YEAR)+"/"+filetype+"/";
StringrealPath=basePath+filePath+filename;//真实文件路径
if(!filename.equals("")){
//如果是修改操作，则删除原来的文件
if(!isEmpty(id)){
FileCatalogfileCatalog=fileCatalogService.findObject(id);
StringfileUrl=fileCatalog.getFileUrl();
if(!isEmpty(fileUrl)){
fileUrl=basePath+fileUrl;
Filefiledel=newFile(fileUrl);
if(filedel.exists()||filedel!=null){
filedel.delete();
}
}
request.setAttribute("entity",fileCatalog);
}
//如果该文件夹不存在则创建一个文件夹
Filefileup=newFile(basePath+filePath);
if(!fileup.exists()||fileup==null){
fileup.mkdirs();
}
//在这里上传文件
InputStreamis=formFile.getInputStream();
OutputStreamos=newFileOutputStream(realPath);
intbytesRead=0;
byte[]buffer=newbyte[8192];
while((bytesRead=is.read(buffer,0,8192))!=-1){
os.write(buffer,0,bytesRead);
}
os.close();
is.close();
}
filePath+=filename;
Stringresult="{"fileName":""+filename+"","fileType":""+filetype+"","fileSize":"+fileSize+","fileUrl":""+filePath+""}";
returnresult;
}
(){
returnfileCatalogService;
}
(){
this.fileCatalogService=fileCatalogService;
}
}
㈣ 用jquery如何实现提交表单点击提交之后显示正在上传中，之后显示上传成功的效果
需要准备的材料分别有：电脑、html编辑器、浏览器。
1、首先，打开html编辑器，新建html文件，例如：index.html，并引入jquery。
㈤ jquery的post方法上传文件问题。
用AJAXForm插件来完成，当然还有很多的jquery插件可以完成无刷新上传，甚至是多文件无刷新同时上传
㈥ JQuery自动上传
success: function (file) 这里是ajax调用成功后的方法，参数file就是从server侧取回的返回值
㈦ jquery 知道文件路径怎么上传
我的理解是你应该先通过图片上传接口把图片上传到服务器上（上传后的服务器端的图片地址，保存到<input type="hidden">里），然后再统一提交所有的表单项。
㈧ jquery实现点击图标上传下载文件
全部代码？估计没人会给你写
㈨ jquery 用a标签控制文件上传
<htmlxmlns="http://www.w3.org/1999/xhtml">
<head>
<title>ajaxFileUpload文件上传例子</title>
<scripttype="text/javascript"src="<%=baseURL%>/kinth/js/ajaxfileupload.js"></script>
<scripttype="text/javascript">
varflag=0;//flag作用：分两种情况提交信息，如果是修改操作，没有修改上传文件，只修改其他字段的信息时点保存也能提交信息
functionuploadFile(){
$.ajaxFileUpload({
url:baseURL+"/fileCatalog.do?method=save",//需要链接到服务器地址
secureuri:true,
fileElementId:'file',//文件选择框的id属性
success:function(data,status){
varresults=$(data).find('body').html();
varobj=eval("("+results+")");
$("#fileSize").val(obj.fileSize);
$("#fileUrl").val(obj.fileUrl);
$('#fileCatalogForm').submit();
},error:function(data,status,e){
showDialogWithMsg('ideaMsg','提示','文件错误！');
}
});
}
functiongetFileName(obj)
{
flag=1;
varpos=-1;
if(obj.value.indexOf("/")>-1){
pos=obj.value.lastIndexOf("/")*1;
}elseif(obj.value.indexOf("\")>-1){
pos=obj.value.lastIndexOf("\")*1;
}
varfileName=obj.value.substring(pos+1);
$("#fileName").val(fileName);
$('.files').text(fileName);
}
functionev_save(){
if(submitMyForm('fileCatalogForm')){
if(flag==0){
$('#fileCatalogForm').submit();
}else{
uploadFile();
}
}
}
functionev_back(){
window.location.href=baseURL+'/fileCatalog.do?method=list';
}
</script>
</head>
<body>
<html:formstyleId="fileCatalogForm"action="/fileCatalog.do?method=save&fileFlag=true"method="post"enctype="application/x-www-form-urlencoded"style="text-align:left;">
<table>
<tr>
<td>附件上传：</td>
<tdstyle="text-align:left;"id="fileTd">
<inputtype="file"name="file"id="file"onChange="getFileName(this);"/><br/>
</td>
<tdcolspan="2"class="tdr">
<olclass=files>
<c:iftest="${entity.resourceId!=null&&entity.resourceId!=''}"><li>${entity.fileName} 上传成功</li></c:if>
</ol>
</td>
</tr>
<c:iftest="${entity.resourceId==null||entity.resourceId==''}">
<inputtype="text"name="fileSize"id="fileSize">
</c:if>
<inputtype="hidden"id="fileUrl"name="fileUrl"value="${entity.fileUrl}"
</table>
</html:form>
</body>