『壹』 怎樣利用ajax實現多個文件上傳
<script type="text/javascript">
$(document).ready(function () {
$("#uploadify").uploadify({
'uploader': 'image/uploadify.swf', //uploadify.swf文件的相對路徑,該swf文件是一個帶有文字BROWSE的按鈕,點擊後淡出打開文件對話框
'script': 'Handler1.ashx',// script : 後台處理程序的相對路徑
'cancelImg': 'image/cancel.png',
'buttenText': '請選擇文件',//瀏覽按鈕的文本,默認值:BROWSE。
'sizeLimit':999999999,//文件大小顯示
'floder': 'Uploader',//上傳文件存放的目錄
'queueID': 'fileQueue',//文件隊列的ID,該ID與存放文件隊列的div的ID一致
'queueSizeLimit': 120,//上傳文件個數限制
'progressData': 'speed',//上傳速度顯示
'auto': false,//是否自動上傳
'multi': true,//是否多文件上傳
//'onSelect': function (e, queueId, fileObj) {
// alert("唯一標識:" + queueId + "\r\n" +
// "文件名:" + fileObj.name + "\r\n" +
『貳』 怎麼樣通過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/ajax 如何以put方式上傳文件
using System.Data.OleDb;
using System.Data;
namespace _211
{
/// <summary>
/// DBQuery 的摘要說明。
/// </summary>
public sealed class DBQuery
{
static OleDbConnection conn=DBConnection.getConn();
static DataTable dt;
public static DataTable OpenQuery(string sql)
{
OleDbDataAdapter da=new OleDbDataAdapter(sql,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName)
{
OleDbDataAdapter da=new OleDbDataAdapter("select * from "+TableName,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count)
{
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" * from "+TableName,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,string IndexColumn,bool IsAsc)
{
OleDbDataAdapter da=new OleDbDataAdapter("select * from "+TableName+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc"),conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count,string IndexColumn,bool IsAsc)
{
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" * from "+TableName+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc"),conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,string[] column,bool IsCondition)
{
string tempsql="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)
{
if(IsCondition)
tempsql+=" and ";
else
tempsql+=",";
}
}
;
string sql="";
if(IsCondition)
sql="select * from "+TableName+" where "+tempsql;
else
sql="select "+tempsql+" from "+TableName;
OleDbDataAdapter da=new OleDbDataAdapter(sql,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,string[] column,string[] condition)
{
string tempsql="";
string tempsql2="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
for(int i=0;i<condition.Length;i++)
{
tempsql2+=condition[i];
if(i<condition.Length-1)tempsql2+=" and ";
}
OleDbDataAdapter da=new OleDbDataAdapter("select "+tempsql+" from "+TableName+" where "+tempsql2,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count,string[] column)
{
string tempsql="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" "+tempsql+" from "+TableName,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count,string[] column,string[] condition)
{
string tempsql="";
string tempsql2="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
for(int i=0;i<condition.Length;i++)
{
tempsql2+=condition[i];
if(i<condition.Length-1)tempsql2+=" and ";
}
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" "+tempsql+" from "+TableName+" where "+tempsql2,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count,string[] column,string IndexColumn,bool IsAsc)
{
string tempsql="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" "+tempsql+" from "+TableName+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc"),conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,int count,string[] column,string[] condition,string IndexColumn,bool IsAsc)
{
string tempsql="";
string tempsql2="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
for(int i=0;i<condition.Length;i++)
{
tempsql2+=condition[i];
if(i<condition.Length-1)tempsql2+=" and ";
}
OleDbDataAdapter da=new OleDbDataAdapter("select top "+count.ToString()+" "+tempsql+" from "+TableName+" where "+tempsql2+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc"),conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,string[] column,string IndexColumn,bool IsAsc,int PageSize,int Page)
{
string tempsql="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
string sql="";
if(Page==0)
sql="select top "+PageSize.ToString()+" "+tempsql+" from "+TableName+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc");
else
sql="select top "+PageSize.ToString()+" "+tempsql+" from "+TableName+" where "+IndexColumn+(IsAsc?">":"<")+"(select "+(IsAsc?"max":"min")+"("+IndexColumn+") from "+TableName+" where "+IndexColumn+" in (select top "+(Page*PageSize)+" "+IndexColumn+" from "+TableName+" order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc")+")) order by "+IndexColumn+" "+(IsAsc?"Asc":"Desc");
OleDbDataAdapter da=new OleDbDataAdapter(sql,conn);
dt=new DataTable();
try
{
da.Fill(dt);
}
catch(Exception ex)
{
throw ex;
}
finally
{
da.Dispose();
}
return dt;
}
public static DataTable OpenTable(string TableName,string[] column,string[] condition,string IndexColumn,bool IsAsc,int PageSize,int Page)
{
string tempsql="";
string tempsql2="";
for(int i=0;i<column.Length;i++)
{
tempsql+=column[i];
if(i<column.Length-1)tempsql+=",";
}
for(int i=0;i<condition.Length;i++)
{
tempsql2+=condition[i];
if(i<condition.Length-1)tempsql2+=" and ";
}
『肆』 怎麼用ajax實現上傳文件的功能
HTTP File Server
http-file-server是用 python 實現的 HTTP 文件伺服器,支持上傳和下載文件。
運行
$ python file-server.py files 8001
其中第一個參數files是存放文件的路徑,第二個參數8001是 HTTP 伺服器埠。
介面
1. 讀取文件
GET /pathtofile/filename
2. 讀取文件夾下所有文件(已經忽略隱藏文件)
GET /path
返迴文件列表為JSON數組,文件名末尾帶有/的表示是文件夾。filename為文件名,mtime為修改時間。
[{"filename":"f1.txt","mtime":1001},{"filename":"p3/","mtime":1002}]
3. 上傳文件
採用POST方式上傳文件,URL參數中傳參數name表示上傳的文件名,POST內容為文件內容。
POST /upload?name=filename
ajax示例:
// file is a FileReader object
var data = file.readAsArrayBuffer();
var xhr = new XMLHttpRequest();
var url = "http://localhost:8001/upload?name=xxx.md";
xhr.open("post", url, true);
xhr.setRequestHeader("Accept", "application/json, text/javascript, */*; q=0.01");
xhr.onreadystatechange = function() {
if (xhr.readyState==4 && xhr.status==200)
{
console.log(xhr.responseText);
}
}
xhr.send(data);
文件名 filename 可以包含相對路徑。比如:upload?name=md/xxx.md。則上傳至md目錄下。
『伍』 如何用ajax上傳文件
引入ajaxfileupload.js
jQuery.extend({
createUploadIframe:function(id,uri)
{
//createframe
varframeId='jUploadFrame'+id;
if(window.ActiveXObject){
vario=document.createElement('<iframeid="'+frameId+'"name="'+frameId+'"/>');
if(typeofuri=='boolean'){
io.src='javascript:false';
}
elseif(typeofuri=='string'){
io.src=uri;
}
}
else{
vario=document.createElement('iframe');
io.id=frameId;
io.name=frameId;
}
io.style.position='absolute';
io.style.top='-1000px';
io.style.left='-1000px';
document.body.appendChild(io);
returnio
},
createUploadForm:function(id,fileElementId)
{
//createform
varformId='jUploadForm'+id;
varfileId='jUploadFile'+id;
varform=$('<formaction=""method="POST"name="'+formId+'"id="'+formId+'"enctype="multipart/form-data"></form>');
varoldElement=$('#'+fileElementId);
varnewElement=$(oldElement).clone();
$(oldElement).attr('id',fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
//setattributes
$(form).css('position','absolute');
$(form).css('top','-1200px');
$(form).css('left','-1200px');
$(form).appendTo('body');
returnform;
},
addOtherRequestsToForm:function(form,data)
{
//addextraparameter
varoriginalElement=$('<inputtype="hidden"name=""value="">');
for(varkeyindata){
name=key;
value=data[key];
varcloneElement=originalElement.clone();
cloneElement.attr({'name':name,'value':value});
$(cloneElement).appendTo(form);
}
returnform;
},
ajaxFileUpload:function(s){
//TODOintroceglobalsettings,,notonlytimeout
s=jQuery.extend({},jQuery.ajaxSettings,s);
varid=newDate().getTime()
varform=jQuery.createUploadForm(id,s.fileElementId);
if(s.data)form=jQuery.addOtherRequestsToForm(form,s.data);
vario=jQuery.createUploadIframe(id,s.secureuri);
varframeId='jUploadFrame'+id;
varformId='jUploadForm'+id;
//Watchforanewsetofrequests
if(s.global&&!jQuery.active++)
{
jQuery.event.trigger("ajaxStart");
}
varrequestDone=false;
//Createtherequestobject
varxml={}
if(s.global)
jQuery.event.trigger("ajaxSend",[xml,s]);
//Waitforaresponsetocomeback
varuploadCallback=function(isTimeout)
{
vario=document.getElementById(frameId);
try
{
if(io.contentWindow)
{
xml.responseText=io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
xml.responseXML=io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
}elseif(io.contentDocument)
{
xml.responseText=io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
xml.responseXML=io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
}
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(xml||isTimeout=="timeout")
{
requestDone=true;
varstatus;
try{
status=isTimeout!="timeout"?"success":"error";
//
if(status!="error")
{
//processthedata()
vardata=jQuery.uploadHttpData(xml,s.dataType);
//Ifalocalcallbackwasspecified,fireitandpassitthedata
if(s.success)
s.success(data,status);
//Firetheglobalcallback
if(s.global)
jQuery.event.trigger("ajaxSuccess",[xml,s]);
}else
jQuery.handleError(s,xml,status);
}catch(e)
{
status="error";
jQuery.handleError(s,xml,status,e);
}
//Therequestwascompleted
if(s.global)
jQuery.event.trigger("ajaxComplete",[xml,s]);
//HandletheglobalAJAXcounter
if(s.global&&!--jQuery.active)
jQuery.event.trigger("ajaxStop");
//Processresult
if(s.complete)
s.complete(xml,status);
jQuery(io).unbind()
setTimeout(function()
{ try
{
$(io).remove();
$(form).remove();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
},100)
xml=null
}
}
//Timeoutchecker
if(s.timeout>0)
{
setTimeout(function(){
//
if(!requestDone)uploadCallback("timeout");
},s.timeout);
}
try
{
//vario=$('#'+frameId);
varform=$('#'+formId);
$(form).attr('action',s.url);
$(form).attr('method','POST');
$(form).attr('target',frameId);
if(form.encoding)
{
form.encoding='multipart/form-data';
}
else
{
form.enctype='multipart/form-data';
}
$(form).submit();
}catch(e)
{
jQuery.handleError(s,xml,null,e);
}
if(window.attachEvent){
document.getElementById(frameId).attachEvent('onload',uploadCallback);
}
else{
document.getElementById(frameId).addEventListener('load',uploadCallback,false);
}
return{abort:function(){}};
},
uploadHttpData:function(r,type){
vardata=!type;
data=type=="xml"||data?r.responseXML:r.responseText;
//Ifthetypeis"script",evalitinglobalcontext
if(type=="script")
jQuery.globalEval(data);
//GettheJavaScriptobject,ifJSONisused.
if(type=="json")
{
//,
//youhavetodeletethe'<pre></pre>'tag.
//ThepretaginChromehasattribute,sohavetouseregextoremove
vardata=r.responseText;
varrx=newRegExp("<pre.*?>(.*?)</pre>","i");
varam=rx.exec(data);
//thisisthedesireddataextracted
vardata=(am)?am[1]:"";//theonlysubmatchorempty
eval("data="+data);
}
//evaluatescriptswithinhtml
if(type=="html")
jQuery("<div>").html(data).evalScripts();
//alert($('param',data).each(function(){alert($(this).attr('value'));}));
returndata;
}
})
2.引入上傳文件所需的jar
7.獲取之後怎麼處理自己看著辦咯,我只能幫到這里了
『陸』 怎麼用ajax上傳文件
表單提交啊<input type="file" />
『柒』 ajax+html實現文件上傳有哪幾種方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>大文件切割上傳</title>
<link rel="stylesheet" href="">
<script>
function selfile(){
const LENGTH = 1024 * 1024 * 10;//每次上傳的大小
var file = document.getElementsByName('video')[0].files[0];//文件對象
var filename=document.getElementsByName('video')[0].files[0].name;
var totalSize = file.size;//文件總大小
var start = 0;//每次上傳的開始位元組
var end = start + LENGTH;//每次上傳的結尾位元組
var fd = null//創建表單數據對象
var blob = null;//二進制對象
var xhr = null;//xhr對象
while(start < totalSize){
fd = new FormData();//每一次需要重新創建
xhr = new XMLHttpRequest();//需要每次創建並設置參數
xhr.open('POST','upload.php',false);
blob = file.slice(start,end);//根據長度截取每次需要上傳的數據
fd.append('video',blob);//添加數據到fd對象中
fd.append('filename',filename); //獲取文件的名稱
xhr.send(fd);//將fd數據上傳
//重新設置開始和結尾
start = end;
end = start + LENGTH;
}
}
</script>
</head>
<body>
<h1>大文件切割上傳</h1>
<input type="file" name="video" onchange="selfile();" />
</body>
</html>
『捌』 java+AJAX上傳文件
http://download.csdn.net/source/214291
http://www.winu.cn/htmls/170/111/
『玖』 怎麼用ajax提交file文件上傳
上傳的文件是沒有辦法和表單內容一起非同步的,可考慮使用jquery的ajaxfileupload,或是其他的插件,非同步上傳文件後,然後再對表單進行操作。
『拾』 JS怎樣用AJAX上傳文件
可以使用jquery的uploadfild插件,或者jquery upload插件進行附件上傳,兩種插件的實現原理差不多,可以進行參考。