AjaxFileUpload.js
修改后:
(function ($, document) { $.extend({ ajaxUploadFile: function (options) { function getId() { return (new Date).getTime() } function createIFrame() { //create frame var iframeId = 'uploadIFrame' + getId(); var $iframe = $('<iframe src="javascript:false" style="display:none"></iframe>'); $iframe.attr('id', iframeId); $iframe.attr('name', iframeId); $iframe.appendTo(document.body); return $('#' + iframeId); } function createForm(actionEle, data) { //create form var newEleId = 'actionEle' + getId(); var formId = 'uploadForm' + getId(); var $form = $('<form action="#" method="POST" name="uploadForm" encoding="multipart/form-data" enctype="multipart/form-data" style="display:none"></form>'); $form.attr('id', formId); if (typeof data == "object") { for (var name in data) { $('<input type="hidden" name="' + name + '" value="' + data[name] + '" />').appendTo($form); } } var newEle = $(actionEle).clone(); $(actionEle).before(newEle); $(actionEle).attr('id', newEleId); $(actionEle).appendTo($form); $form.appendTo('body'); return $('#' + formId); } function handleError(opts, xhr, status, e) { if (opts.error) { opts.error.call(opts.context || opts, xhr, status, e); } if (opts.global) { (opts.context ? $(opts.context) : $.event).trigger("ajaxError", [xhr, opts, e]); } } function parseHttpData(r, type) { var data = !type; data = (type == "xml" || data) ? r.responseXML : r.responseText; if (type == "script") { // If the type is "script", eval it in global context $.globalEval(data) } else if (type == "json") { // Get the JavaScript object, if JSON is used. var str = $(data).text(); data = $.parseJSON(str) } else if (type == "html") { // evaluate scripts within html $("<div>").html(data).evalScripts(); } else { $("<div>").html(data) } return data; } // actionEle, url, data var opts = $.extend($.ajaxSettings, options || {}); var $iframe = createIFrame(); var $form = createForm(opts.actionEle, opts.data); // Watch for a new set of requests if (opts.global && !$.active++) { $.event.trigger("ajaxStart"); } var requestDone = false; var xml = {}; if (opts.global) $.event.trigger("ajaxSend", [xml, opts]); var uploadCallback = function (isTimeout) { var iframe = document.getElementById($iframe.attr('id')); try { if (iframe.contentWindow) { xml.responseText = iframe.contentWindow.document.body ? iframe.contentWindow.document.body.innerHTML : null; xml.responseXML = iframe.contentWindow.document.XMLDocument ? iframe.contentWindow.document.XMLDocument : iframe.contentWindow.document; } else if (iframe.contentDocument) { xml.responseText = iframe.contentDocument.document.body ? iframe.contentDocument.document.body.innerHTML : null; xml.responseXML = iframe.contentDocument.document.XMLDocument ? iframe.contentDocument.document.XMLDocument : iframe.contentDocument.document; } } catch (e) { handleError(opts, xml, null, e); } if (xml || isTimeout == "timeout") { requestDone = true; var status; try { status = isTimeout != "timeout" ? "success" : "error"; if (status != "error") { var data = parseHttpData(xml, opts.dataType); if (opts.success) opts.success(data, status); if (opts.global) $.event.trigger("ajaxSuccess", [xml, opts]); } else handleError(opts, xml, status); } catch (e) { status = "error"; handleError(opts, xml, status, e); } if (opts.global) $.event.trigger("ajaxComplete", [xml, opts]); // Handle the global AJAX counter if (opts.global && !--$.active) $.event.trigger("ajaxStop"); // Process result if (opts.complete) opts.complete(xml, status); $($iframe).unbind(); setTimeout(function () { try { $($iframe).remove(); $($form).remove(); } catch (e) { handleError(opts, xml, null, e); } }, 1000); xml = null } }; // Timeout checker if (opts.timeout > 0) { setTimeout(function () { // Check to see if the request is still happening if (!requestDone) uploadCallback("timeout"); }, opts.timeout); } try { $form.attr('action', opts.url); $form.attr('method', 'POST'); $form.attr('target', $iframe.attr('name')); $form.submit(); } catch (e) { handleError(opts, xml, null, e); } $iframe.load(uploadCallback); return {abort: function () { }}; } }) })(jQuery, document);
相关推荐
在现代Web应用中,无刷新文件上传是一种提升用户体验的重要技术,它允许用户在不重新加载整个页面的情况下上传文件。PHP和AJAX结合可以很好地实现这一功能。本文将深入讲解如何利用PHP和AjaxFileUpload插件来创建一...
此为前端进行文件上传,使用Ajax方式提交的js插件,使用方便简洁,开发很高效。
在IT行业中,前端开发经常会遇到文件上传的需求,而AjaxFileUpload是一个非常实用的jQuery插件,用于实现异步文件上传。这个修复版的AjaxFileUpload针对高版本的jQuery进行了优化和兼容性处理,解决了在处理返回的...
在IT行业中,多文件上传是Web应用程序中常见的一项功能,特别是在需要用户批量上传图片、文档等数据时。本文将深入探讨使用JavaScript控件实现多文件上传,并结合Ajax技术以实现异步传输,同时提供C#后端处理示例。 ...
"php_ajax_file_upload_with_progressbar"项目就是针对这种需求而设计的,它利用PHP、jQuery和Ajax技术,实现了一个带有进度条的文件上传功能。下面我们将深入探讨这个项目的核心知识点。 首先,**PHP**是服务器端...
最近项目中出现上传文件返回的json数据会被提示下载,只有在ie10+中才会出现这个问题。前端使用jQuery的插件ajaxForm提交表单,后台返回的数据格式为json。代码如下: 后端Python: 代码如下: def jsonp(func): ...
原生JavaScript实现文件异步上传的实例讲解包含了使用原生JavaScript创建文件上传功能的核心技术点和实现逻辑。这里将详细解释以下几个主要知识点: 1. HTML表单元素: 实例中使用了HTML的表单元素,包括一个用于...