ajaxFileUpload上傳帶參數,返回值改成json格式

来源:https://www.cnblogs.com/lijl/archive/2018/08/20/9505240.html
-Advertisement-
Play Games

/*直接複製在自己的js文件中就能使用*/ jQuery.extend({ createUploadIframe: function (id, uri) { //create frame var frameId = 'jUploadFrame' + id; if (window.ActiveXObj ...


/*直接複製在自己的js文件中就能使用*/

jQuery.extend({
createUploadIframe: function (id, uri) {
//create frame
var frameId = 'jUploadFrame' + id;

if (window.ActiveXObject) {
var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
if (typeof uri == 'boolean') {
io.src = 'javascript:false';
}
else if (typeof uri == 'string') {
io.src = uri;
}
}
else {
var io = 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);
return io
},
createUploadForm: function (id, fileElementId, data) {
//create form
var formId = 'jUploadForm' + id;
var fileId = 'jUploadFile' + id;
var form = $('<form action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-
data"></form>');
var oldElement = $('#' + fileElementId);
var newElement = $(oldElement).clone();
$(oldElement).attr('id', fileId);
$(oldElement).before(newElement);
$(oldElement).appendTo(form);
//<span style="color:#ff0000;">增加文本參數的支持,修改本處,本處應有掌聲 </span>
if (data) {
for (var i in data) {
var temp = $('<input type="hidden" name="' + i + '" />');
temp.val(data[i]);
temp.appendTo(form);
}
}
//set attributes
$(form).css('position', 'absolute');
$(form).css('top', '-1200px');
$(form).css('left', '-1200px');
$(form).appendTo('body');
return form;
},
ajaxFileUpload: function (s) {
// TODO introduce global settings, allowing the client to modify them for all requests, not only timeout
s = jQuery.extend({}, jQuery.ajaxSettings, s);
var id = new Date().getTime()
var form = jQuery.createUploadForm(id, s.fileElementId, s.data);
var io = jQuery.createUploadIframe(id, s.secureuri);
var frameId = 'jUploadFrame' + id;
var formId = 'jUploadForm' + id;
// Watch for a new set of requests
if (s.global && !jQuery.active++) {
jQuery.event.trigger("ajaxStart");
}
var requestDone = false;
// Create the request object
var xml = {}
if (s.global)
jQuery.event.trigger("ajaxSend", [xml, s]);
// Wait for a response to come back
var uploadCallback = function (isTimeout) {
var io = 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;
} else if (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;
var status;
try {
status = isTimeout != "timeout" ? "success" : "error";
// Make sure that the request was successful or notmodified
if (status != "error") {
// process the data (runs the xml through httpData regardless of callback)
var data = jQuery.uploadHttpData(xml, s.dataType);
// If a local callback was specified, fire it and pass it the data
if (s.success)
s.success(data, status);
// Fire the global callback
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);
}
// The request was completed
if (s.global)
jQuery.event.trigger("ajaxComplete", [xml, s]);
// Handle the global AJAX counter
if (s.global && ! --jQuery.active)
jQuery.event.trigger("ajaxStop");
// Process result
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
}
}
// Timeout checker
if (s.timeout > 0) {
setTimeout(function () {
// Check to see if the request is still happening
if (!requestDone) uploadCallback("timeout");
}, s.timeout);
}
try {
// var io = $('#' + frameId);
var form = $('#' + 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) {
/*源代碼
var data = !type;
data = type == "xml" || data ? r.responseXML : r.responseText;
// If the type is "script", eval it in global context
if (type == "script")
jQuery.globalEval(data);
// Get the JavaScript object, if JSON is used.
if (type == "json")
eval("data = " + data);
// evaluate scripts within html
if (type == "html")
jQuery("<div>").html(data).evalScripts();
//alert($('param', data).each(function(){alert($(this).attr('value'));}));
return data;
*/
//修改後返回格式給成json
var data = r.responseText;
var start = data.indexOf("{");
var end = data.indexOf("}");
var jsonStr = data.substring(start, end + 1);
return (jsonStr instanceof Object) ? jsonStr : eval("(" + jsonStr + ")");
}
})

/*==上面的代碼直接複製在自己的js文件中就能使用==========================================================================================*/

/*js上傳代碼*/

$.ajaxFileUpload({
type: "POST",
contentType: false,
enctype: "multipart/form-data",
url: "/url/路徑",
data: { 參數名: JSON.stringify(參數名), 參數名: JSON.stringify(參數名) },//參數做json序列化(參數可以使對象、集合、欄位)
secureuri: false,
fileElementId: 'file_name',
dataType: 'json',
async: false,
success: function (data) {
//關閉等待
MaskUtil.unmask();
if (data.IsSuccess) {
$.messager.alert('操作提示', data.Message, 'info');
}
else {
$.messager.alert('操作提示', data.Message, 'info');
}
}
});

/*個人心得

1.ajaxFileUpload傳參數時data:{後臺接收的參數名:要傳的參數對象},這裡值需要做json序列化

2.ajaxFileUpload返回值json格式,已在1.ajaxFileUpload.js文件修改其返回值,

3.後臺接收參數使用Request["後臺接收的參數名"],這裡值需要做json返序列化

*/


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  •  ASP.NET Core 2.1中基於角色的授權 授權是來描述用戶能夠做什麼的過程。例如,只允許管理員用戶可以在電腦上進行軟體的安裝以及卸載。而非管理員用戶只能使用軟體而不能進行軟體的安裝以及卸載。它是獨立的而又與驗證配合使用,需要身份驗證機制。對於應用程式來說,首先需要進行身份驗證,然後進行進 ...
  • 移除 X-AspNetMvc-Version 在 Global.asax 的 Application_Start添加代碼 移除 X-AspNet-Version 在 web.config 下的 system.web 節點下設置 enableVersionHeader=false 移除 X-Power ...
  • 擴展方法(Extension Methods)是C#3.0時引入的新特性,相信很多人都聽過並且也都用過,最常見的是在LINQ中的使用。 不僅如此,在開發中,我們也可以創建自己擴展方法,使用它來優化類的設計、簡化代碼。本文將簡單地介紹擴展方法的概念、定義、使用場景以及要註意的點。 不僅如此,在開發中, ...
  • 1、值類型和引用類型 值類型 簡單類型:int/double/float/char/bool/ 枚舉:enum 結構:struct 引用類型 類、數組、介面、字元串 區別: 值類型 存儲在記憶體的棧中,從棧中可以快速訪問數據,值類型存儲的是實際數據 將一個值類型變數賦值給另一個值類型變數,屬於值被覆制 ...
  • Log4net 介紹 Log4net 是 Apache 下一個開放源碼的項目,它是Log4j 的一個克隆版。我們可以控制日誌信息的輸出目的地。Log4net中定義了多種日誌信息輸出模式。它可以根據需要將日誌輸出到控制台,文本文件,windows 日誌事件查看器中,包括資料庫,郵件等等位置,以便我們快 ...
  • Docker相信很多朋友都使用過,做微服務比虛擬機還好用。 需要安裝的一些東西 ffmpeg: dotnet: 預設全是latest最新即可,具體怎麼配置網上搜索一下即可。 調用用REST? 還是用RPC? 微服務之間的介面調用通常包含兩個部分,序列化和通信協議。常見的序列化協議包括json、xml ...
  • 今天回憶了之前看的《深入理解C#》這本書中的泛型章節,其中對泛型的可變性的理解。泛型可變性分兩種:協變和逆變。逆變也又稱為抗變。 怎麼理解這兩個名詞的意思: ①:協變即為在泛型介面類型中使用out標識的類型參數。協變的字面意思是“與變化的方向相同”②逆變那就是用in來標識的泛型介面類型的類型參數。逆 ...
  • 面向對象:用線性的思維。與面向過程相輔相成。在軟體開發過程中,巨集觀上,用面向對象來把握事物間複雜的關係,分析系統。微觀上,仍然使用面向過程。 “面向過程”是一種是事件為中心的編程思想。就是分析出解決問題所需的步驟,然後用函數把這寫步驟實現,並按順序調用。 ”面向對象“是以“對象”為中心的編程思想。 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...