js文件的下载地址 : http://files.cnblogs.com/wangqc/ajaxfileupload.js

页面代码：

<html>
    <!-- 引入相关的js文件，相对路径  -->
    <script type="text/javascript" src="js/jquery.js"></script>
      <script type="text/javascript" src="js/ajaxfileupload.js"></script>

<!-- 执行上传文件操作的函数 -->
      <script type="text/javascript">

function ajaxFileUpload(id){
                $.ajaxFileUpload(
               {
                   url: 'About.aspx',
                   fileElementId: id,
                   dataType: 'json',
                   success: function (data, status) {
                       alert('添加成功');
                   },
                   error: function (data, status, e) {
                       alert('添加失败');
                   }
               });
            }

$(function() {
                $("#btnSubmit").click(function () {
                    ajaxFileUpload("mytestfile");
                });
            });

</script>
  </head>

同时 请注意 对应的file 控件一定要有name 属性，否则无论如何都不能进行此上传操作。

主要参数说明：
1，url表示处理文件上传操作的文件路径，可以测试URL是否能在浏览器中直接访问，如上：upload.php
2，fileElementId表示文件域ID，如上：fileToUpload
3，secureuri是否启用安全提交，默认为false
4，dataType数据数据，一般选json，javascript的原生态
5，success提交成功后处理函数
6，error提交失败处理函数
  
   <body>
        <form method="post" enctype="multipart/form-data"> 
            <input type="file" value="我的文档" id="mytestfile" name="file1"  />
            <input type="button" value="上传" id="btnSubmit"/>
        </form>
    </body>

服务器代码可以参考本人的另外一篇，有详细的详解（前面extjs的部分可以不用看 ，直接跳过看后台的上传部分。 完全没有任何影响！） http://www.cnblogs.com/wangqc/p/extjsFileUpload.html

jquery 实现ajax 上传文件的功能（使用插件 ajaxfileupload）的更多相关文章

  1. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  2. jQuery ajax上传文件实例

    jQuery ajax上传文件实例 <form id="form" enctype="multipart/form-data"><input ...

  3. ajax上传文件 基于jquery form表单上传文件

    <script src="/static/js/jquery.js"></script><script> $("#reg-btn&qu ...

  4. flask jQuery ajax 上传文件

    1.html 代码 <div> <form id="uploadForm" enctype="multipart/form-data" > ...

  5. 闲话ajax，例ajax轮询，ajax上传文件[开发篇]

    引语:ajax这门技术早已见怪不怪了,我本人也只是就自己真实的经验去总结一些不足道的话.供不是特别了解的朋友参考参考! 本来早就想写一篇关于ajax的文章的,但是前段时间一直很忙,就搁置了,趁着元旦放 ...

  6. ajax上传文件以及实现上传进度条（转载）

    做微信企业号的时候,在‘我的日志'功能模块里边需要添加一个上传文件的功能,并且要显示上传过程中的进度条和提交后的文件名列表,于是做了基于ajax的文件上传,UI用的是MUI框架,后台是TP框架 前端代 ...

  7. atitit.ajax上传文件的实现原理 与设计

    atitit.ajax上传文件的实现原理 与设计 1. 上传文件的三大难题 1 1.1. 本地预览 1 1.2. 无刷新 1 1.3. 进度显示 1 2.  传统的html4  + ajax 是无法直 ...

  8. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

  9. django 基于form表单上传文件和基于ajax上传文件

    一.基于form表单上传文件 1.html里是有一个input type="file" 和 ‘submit’的标签 2.vies.py def fileupload(request ...

随机推荐

  1. 【转】设计模式 ( 十七) 状态模式State（对象行为型）

    设计模式 ( 十七) 状态模式State(对象行为型) 1.概述 在软件开发过程中,应用程序可能会根据不同的情况作出不同的处理.最直接的解决方案是将这些所有可能发生的情况全都考虑到.然后使用if... ...

  2. 文件对比工具Beyond Compare使用方法

    今天向大家介绍一个使用起来十分方便且功能十分强大的文件对比工具-Beyond Compare. 1    工具下载 工具的下载很简单,百度搜索Beyond Compare即可. 下载完成后,解压缩,双 ...

  3. js判断ie版本号

     jQuery 2.0 去除了对浏览器版本号的判断(它推荐特性检测),这里是一个老外写的原生判断方法,这段代码着实巧妙!既简介.有向后兼容!一般做法都是:正则搜索 USER_AGENT :但因为历史原 ...

  4. Redis学习笔记(4)-List

    package cn.com; import java.util.List; import redis.clients.jedis.Jedis; import redis.clients.jedis. ...

  5. 关于java字符串编译优化问题

    情景一:不好的字符串拼接习惯    起因是这样的:一个大牛在写了一篇关于java字符串优化问题的讲解,他提到:不要使用strObj+otherValue的方法将otherValue转换为字符串形式,因 ...

  6. Linux QtCreator设置mingw编译器生成windows程序

    Qt跨平台,那必须在Linux平台编译一个可以在windows下运行的Qt程序才行,当然还得和QtCreator环境弄在一起才行. 工作环境:Centos 7 yum install qt5-qt* ...

  7. Emiller's Advanced Topics In Nginx Module Development

    Emiller的Nginx模块开发指南 By Evan Miller DRAFT: August 13, 2009 (changes) 翻译:Kongch @2010年1月5日 0:04am -- 2 ...

  8. C# base和this

    • 是否可以在静态方法中使用base和this,为什么? • base常用于哪些方面?this常用于哪些方面? • 可以base访问基类的一切成员吗? • 如果有三层或者更多继承,那么最下级派生类的b ...

  9. robot framework安装步骤

    1.安装python-2.7.11.amd64.msi 2.在命令行窗口输入python命令验证是否成功 3.安装wxPython2.8-win64-unicode-2.8.12.1-py27.exe ...

  10. winston 日志管理4

    配置File Transport winston.add(winston.transports.File, options) The File transport should really be t ...