`
s343174147
  • 浏览: 33377 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

AjaxFileUpload实现文件异步上传(AjaxFileUpload.js文件下载及参数介绍)

 
阅读更多

AjaxFileUpload实现文件异步上传效果更好,使用简单:

<!DOCTYPE html> <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="http://www.phpddt.com/usr/themes/dddefault/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="ajaxfileupload.js"></script> </head> <script> jQuery(function(){ $("#buttonUpload").click(function(){ //加载图标 /* $("#loading").ajaxStart(function(){ $(this).show(); }).ajaxComplete(function(){ $(this).hide(); });*/ //上传文件 $.ajaxFileUpload({ url:'upload.php',//处理图片脚本 secureuri :false, fileElementId :'fileToUpload',//file控件id dataType : 'json', success : function (data, status){ if(typeof(data.error) != 'undefined'){ if(data.error != ''){ alert(data.error); }else{ alert(data.msg); } } }, error: function(data, status, e){ alert(e); } }) return false; }) }) </script> <body> <input id="fileToUpload" type="file" size="20" name="fileToUpload" class="input"> <button id="buttonUpload">上传</button> </body> </html>

上传还可以传递参数:

var data = { name: 'my name', description: 'short description' } $.ajaxFileUpload({ url: 'upload.php', secureuri: false, data: data, fileElementId: 'fileToUpload', dataType: 'json', success: function (data) { alert(data.msg); }, error: function (data) { alert("error"); } });

主要参数说明:

1,url表示处理文件上传操作的文件路径,可以测试URL是否能在浏览器中直接访问,如上:upload.php

2,fileElementId表示文件域ID,如上:fileToUpload

3,secureuri是否启用安全提交,默认为false

4,dataType数据数据,一般选json,javascript的原生态

5,success提交成功后处理函数

6,error提交失败处理函数

需要了解相关的错误提示

1,SyntaxError: missing ; before statement错误

如果出现这个错误就需要检查url路径是否可以访问

2,SyntaxError: syntax error错误

如果出现这个错误就需要检查处理提交操作的PHP文件是否存在语法错误

3,SyntaxError: invalid property id错误

如果出现这个错误就需要检查属性ID是否存在

4,SyntaxError: missing } in XML expression错误

如果出现这个错误就需要检查文件域名称是否一致或不存在

5,其它自定义错误

转载请注明地址: http://www.phpddt.com/dhtml/ajaxfileupload.html 尊重他人劳动成果就是尊重自己!

上面的参数有些可以用在ajaxSubmit中,发现ajax开头的js方法参数都差不多

分享到:
评论

相关推荐

    AjaxFileUpload.js

    AjaxFileUpload.js是一个专为实现异步文件上传功能而设计的JavaScript库,它利用Ajax技术实现了无刷新的文件上传,极大地提升了用户体验。在本文中,我们将深入探讨AjaxFileUpload.js的工作原理、使用方法以及相关的...

    asp.net-ajaxfileupload.js-实现文件异步上传代码分享.doc

    asp.net-ajaxfileupload.js-实现文件异步上传代码分享.doc

    ajaxfileupload实现异步式上传文件

    AjaxFileUpload是基于jQuery的一个插件,它利用了AJAX技术来实现文件的后台异步上传。AJAX(Asynchronous JavaScript and XML)的核心在于通过JavaScript与XMLHttpRequest对象进行通信,使得前端与后台的数据交换...

    方便自己下载的ajaxfileupload.js备份

    "方便自己下载的ajaxfileupload.js备份"这个资源正专注于解决一个关键问题:前端图片的异步上传。该资源提供了两个核心文件,即jquery.min.js和ajaxfileupload.js,它们共同构成了一个简单的图片上传解决方案。 ...

    ajaxfileupload.js 异步上传jquery插件

    1. **异步上传**:AjaxFileUpload.js 利用 AJAX 技术实现文件的后台上传,不会阻塞用户界面,提高了用户体验。 2. **进度条显示**:虽然原插件可能未内置,但可以通过自定义事件监听和处理来实现上传进度条,展示...

    AJAXFileUpload ajax 异步文件上传 进度条

    AJAXFileUpload是一种基于AJAX技术的异步文件上传组件,它允许用户在不刷新页面的情况下上传文件,并且可以实时显示上传进度,提供良好的用户体验。本文将深入探讨AJAXFileUpload的工作原理、实现方式以及其在实际...

    ajaxfileupload.js

    ajaxfileupload.js, jquery异步文件上传插件

    ajaxfileupload.js多文件上传

    ajaxfileupload.js 这是个非常好的异步上传图片的插件,来解决form表单上传时要刷新页面的问题。支持多文件上传

    ajaxfileupload.js/ui.core.js/

    ajaxfileupload.js/ ui.core.js/ ui.draggable.js/ jquery.imagecropper.js/ ui.draggable.js 实现图片异步上传的和图片的剪切功能,整个小项目,解压即可部署使用。

    ajaxfileupload.js完整使用全套(带对应jquery+demo)

    `ajaxfileupload.js`是一个JavaScript库,用于实现异步文件上传功能,避免了传统文件上传时页面刷新的问题。它与jQuery的结合使得文件上传更加简便、高效。 首先,我们来理解`ajaxfileupload.js`的核心概念。这个...

    ajaxfileupload.js实现文件异步上传

    ajaxfileupload.js实现文件异步上传

    ajaxfileupload实现文件上传_aspnet.zip

    AjaxFileUpload控件是一个非常实用的工具,它允许我们在不刷新页面的情况下实现文件的上传。下面,我们将详细探讨如何使用AjaxFileUpload和ASP.NET MVC来实现这一功能。 首先,我们需要了解AjaxFileUpload的基本...

    使用ajaxFileUpload.js上传文件

    `AjaxFileUpload.js`是一个JavaScript库,它允许我们实现异步(Ajax)文件上传,无需刷新页面,提供了更为友好的用户体验。本篇文章将深入探讨`AjaxFileUpload.js`的工作原理、使用方法及其相关知识点。 `...

    ajaxfileupload.js实现异步上传JAVAEE

    `ajaxfileupload.js` 是一个JavaScript库,专门用于实现这种功能,它允许开发者使用Ajax技术进行文件的异步上传。这个库特别适合与jQuery库配合使用,尤其是jQuery 1.11.1.min.js及其后的版本。 **jQuery的...

    jquery-1.2.1.js和ajaxfileupload.js

    在实际应用中,将“jquery-1.2.1.js”和“ajaxfileupload.js”结合使用,可以轻松地实现在网页上添加一个动态的、用户友好的文件上传功能。首先,在页面中引入jQuery库,然后引入AjaxFileUpload插件。接着,通过编写...

    AjaxFileUpload实现文件上传

    AjaxFileUpload是基于JavaScript和AJAX技术的一种实现文件上传的方式,它允许用户在不刷新整个页面的情况下进行文件上传,提供了一种更为流畅的用户体验。在本文中,我们将深入探讨AjaxFileUpload的工作原理、如何...

    Ajaxfileupload.js 异步上传图片

    ajaxfileupload.js 这是个非常好的异步上传图片的插件,来解决form表单上传时要刷新页面的问题。

    ajaxfileupload.js(异步上传文件插件)

    jquery的一款异步文件上传插件,我博客中有关于此插件的详细教程。 handleError: function( s, xhr, status, e ) { // If a local callback was specified, fire it if ( s.error ) { s.error.call( s....

    文件上传 ajaxfileupload.zip

    标题中的“文件上传 ajaxfileupload.zip”提示我们这个压缩包可能包含了一个用于实现文件上传功能的JavaScript库,名为“ajaxfileupload.js”。在Web开发中,文件上传是常见且重要的功能,尤其在需要用户提交图片、...

Global site tag (gtag.js) - Google Analytics