當前位置:首頁 » 文件傳輸 » jqueryajax上傳附件
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

jqueryajax上傳附件

發布時間: 2022-01-14 08:26:18

㈠ tp用jquery.form怎麼ajax上傳文件啊,給個例子

JSON和JSONP雖然只有一個字母的差別,但其實他們根本不是一回事兒:JSON是一種數據交換格式,而JSONP是一種依靠開發人員的聰明才智創造出的一種非官方跨域數據交互協議。
拿最近比較火的諜戰片來打個比方,JSON是地下黨們用來書寫和交換情報的「暗號」,而JSONP則是把用暗號書寫的情報傳遞給自己同志時使用的接頭方式。看到沒?一個是描述信息的格式,一個是信息傳遞雙方約定的方法。

㈡ 怎麼樣通過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 ";
}

㈣ 使用jquery.form.js 提交包含附件的表單

增加所有需要的事件監聽器,為ajax提交表單做准備。ajaxForm並不能提交表單。在document的ready函數中,使用ajaxForm來為ajax提交表單進行准備。
$("#formid").ajaxForm();

㈤ jquery ajax 上傳文件當不到內容,怎麼解決啊,見小例子

jquery不能直接上傳文件,去找jquery上傳組件去

㈥ jquery上傳文件是怎麼實現的

本篇文章是對Jquery中的LigerUI實現文件上傳的方法,進行了分析介紹,需要的朋友可以參考下
一、在Head中加入
<script src="../lib/js/ajaxfileupload.js" type="text/javascript"></script>
<script src="../lib/js/ligerui.expand.js" type="text/javascript"></script>
二、Html中的Div代碼

復制代碼 代碼如下:
<div id="AppendBill_Div" style="display:none;"> <%-- 上傳 - 單 --%>
<table style="height:100%;width:100%">
<tr style="height:40px">
<td style="width:20%">
圖標:
</td>
<td><input type="file" style="width:200px" id="fileupload" name="fileupload"/>
</td>
</tr>
</table>
</div>

三、Js中-寫的是關鍵部分,會LigerUI的朋友-你懂得
1、grid中添加項【存地址欄位】
{ display: "掃描件", name: "AppendBillPath", width: 120, type: "text", align: "left" }
2、Form可添加項【存地址和彈出選擇框】
{ name: "AppendBillPath1", type: "hidden" }, // --上傳-【5】--
{ display: "掃描件", name: "AppendBillPath", comboboxName: "AppendBillPath2", newline: true, labelWidth: 100, width: 150, space: 30, type: "select", options: {}} // --上傳-【6】--
$.ligerui.get("AppendBillPath2").set('onBeforeOpen', f_selectAppendBillPath_1) // 【掃描件】 // --上傳-【7】--
3、事件
// #region ======================================= 【上傳掃描件窗口】 // --上傳-【8】--
復制代碼 代碼如下:
var AppendBillPathDetail = null;
function f_selectAppendBillPath_1() {
var imageurl = $("#AppendBill").val();
var AppendBill_Id = $("#AppendBill").val(); // 單號
if (imageurl.length == 0) {
LG.showError("您沒有輸入單號,請輸入隨單號!");
return;
}
if (AppendBillPathDetail) {
AppendBillPathDetail.show();
}
else {
AppendBillPathDetail = $.ligerDialog.open({
target: $("#AppendBill_Div"), title: '添加圖標',
width: 360, height: 170, top: 170, left: 280, // 彈出窗口大小
buttons: [
{ text: '上傳', onclick: function () { AppendBillPath_save(); } },
{ text: '取消', onclick: function () { AppendBillPathDetail.hide(); } }
]
});
}
}
function AppendBillPath_save()
{
var imgurl = $("#fileupload").val();
// var filehelpcode = $("#filehelpcode").val();
var extend = imgurl.substring(imgurl.lastIndexOf("."), imgurl.length);
extend = extend.toLowerCase();
if (extend == ".jpg" || extend == ".jpeg" || extend == ".png" || extend == ".gif" || extend == ".bmp")
{
}
else
{
LG.showError("請上傳jpg,jpep,png,gif,bmp格式的圖片文件");
return;
}
var imageurl = $("#AppendBill").val(); // extend
alert(imageurl);
$.ajaxFileUpload({
url: "../handle/ImageUpload.aspx?imageurl=" + imageurl, // --上傳-【9】-- aspx文件
secureuri: false,
fileElementId: "fileupload", //Input file id
dataType: "text",
success: function (data, status)
{
// ----------------- // 保存路徑
// $("#AppendBillPath2").val(Data);

LG.tip(data);
f_reload();
},
error: function (data, status, e) {
LG.showError(data);
}
});
}
// #endregion

四、後台cs,寫一句關鍵的,可以返回參數,前台提示
string url = Server.MapPath("/Image/" + gfilename + filenameext); // 執行上傳操作

㈦ jquery 的$ajax;能實現AJAX上傳文件嗎

用formData對象
把files對象放到formData中去

也可以使用fileReader對象來獲取文件的base64編碼,然後把base64編碼直接post給後台。

㈧ 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}&nbsp;&nbsp;上傳成功</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>

㈨ 用 ajax 也好 jquery 也好 怎麼用 put 方法來上傳文件 最好參數寫詳細些

瀏覽器是無法提交put請求的

㈩ ajax jquery 中的 文件上傳問題(jsp+java開發)

要想用ajax進行非同步上傳的話,需要依靠插件