jq的ajax完整版本

$(function () {
    fileChange();
});
function fileChange() {
    $('#fileinput').change(function () {
        ajaxUploadImg();
    });
}
function ajaxUploadImg() {
    var formData = new FormData($('#idcardA')[0]);
    $.ajax({
        url: appObj.baseApiUrl + '/userinfo/UploadIDCardInfo',  //server script to process data
        type: 'POST',
        datatype: 'json',
        contentType: false,
        xhr: function () {  // custom xhr
            myXhr = $.ajaxSettings.xhr();
            if (myXhr.upload) { // check if upload property exists
                myXhr.upload.addEventListener('progress', progressHandlingFunction, false); // for handling the progress of the upload
            }
            return myXhr;
        },
        //Ajax事件
        //beforeSend: beforeSendHandler,
        success: function (data) {
            $('#idCardimg').attr('src', appObj.baseUrl + data);
        },
        error: function () {
            alert('error');
        },
        // Form数据
        data: formData,
        //Options to tell JQuery not to process data or worry about content-type
        cache: false,
        processData: false
    });
}
 
 
 
上传身份证正面照片:
                    <form id="idcardA" enctype="multipart/form-data">
                        <input id="fileinput" name="file" type="file" />
                    </form>

关于jq ajax封装以及ajax上传Webapi的更多相关文章

  1. 一个ajax实现表单上传文件的神器 formdata

    通过传统的form表单提交的方式上传文件: $.ajax({ url : "http://localhost:8080/STS/rest/user", type : "P ...

  2. Ajax+PHP实现异步上传多张图片

    Ajax+PHP实现异步上传多张图片 HTML代码 <!-- date: 2018-04-27 13:46:55 author: 王召波 descride: 多张图片上传 --> < ...

  3. spring mvc ajax异步文件的上传和普通文件上传

    表单提交方式文件上传和ajax异步文件上传 一:首先是我在spring mvc下的表单提交方式上传 ssm的包配置我就不一一详细列出来了,但是上传的包我还是列出来 这一段我也不知道怎么给大家讲解就是直 ...

  4. PHP+Ajax+plupload无刷新上传头像代码

    很简单的一款PHP+Ajax+plupload无刷新上传头像代码,兼容性很好,可以直接拿来用.你可以自定义各种类型的文件.本实例中只能上传"jpg", "png" ...

  5. Ajax实现文件的上传

    Ajax实现文件的上传 准备 ajax的参数补充 type不写的话默认是GET dataType和ContentType: dataType: 浏览器发给服务器希望返回的数据类型 .. 如果明确地指定 ...

  6. egg.js 通过 form 和 ajax 两种方式上传文件并自定义目录和文件名

    egg.js 通过 form 和 ajax 两种方式上传文件并自定义目录和文件名 评论:10 · 阅读:8437· 喜欢:0 一.需求 二.CSRF 校验 三.通过 form 表单上传文件 四.通过 ...

  7. SpringMVC+Ajax实现文件批量上传和下载功能实例代码

    需求: 文件批量上传,支持断点续传. 文件批量下载,支持断点续传. 使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中. 服务器不需要打包. 支持大文件断点下载.比如下 ...

  8. jQuery+php+ajax实现无刷新上传文件功能

    jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...

  9. 基于vue-simple-uploader封装文件分片上传、秒传及断点续传的全局上传插件

    目录 1. 前言 2. 关于vue-simple-uploader 3. 基于vue-simple-uploader封装全局上传组件 4. 文件上传流程概览 5. 文件分片 6. MD5的计算过程 7 ...

随机推荐

  1. Spring事务管理要点总结

    # Spring事务管理要点总结 ### 要点---- 事务是企业级应用中必不可缺少的技术,用来确保数据的完整性和一致性.- Spring事务管理并不实现事务管理的实现,而是借助Hibernate\J ...

  2. 6. 集成学习(Ensemble Learning)算法比较

    1. 集成学习(Ensemble Learning)原理 2. 集成学习(Ensemble Learning)Bagging 3. 集成学习(Ensemble Learning)随机森林(Random ...

  3. jQuery 实现前端模糊匹配与首字母搜索

    实现效果 源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...

  4. CACTI命令行添加DEVICE/GRAPH/TREE

    有时要加入大量的机器到 Cacti ,直接修改 Cacti  还是很复杂的.所以最好还是通过他本身提供的工具来实现. Cacti  早就为我们想到过这个问题了.这些工具就在   cacti/cli 目 ...

  5. sam9260 adc module

    /* * driver/char/at91_adc.c * * Copyright (C) 2007 Embedall Technology Co., Ltd. * * Analog-to-digit ...

  6. Android keytool 生成keystore与给APK签名

    http://www.tttabc.com/android/keytool-keystore-jarsigner-apk.htm

  7. jstorm之于storm

    关于流处理框架,在先前的文章汇总已经介绍过Strom,今天学习的是来自阿里的的流处理框架JStorm.简单的概述Storm就是:JStorm 比Storm更稳定,更强大,更快,Storm上跑的程序,一 ...

  8. Hbase 学习(五) 调优

    1.垃圾回收器调优 当我们往hbase写入数据,它首先写入memstore当中,当menstore的值大于hbase.hregion.memstore.flush.size参数中设置的值后,就会写入硬 ...

  9. w3svc无法启动

    w3svc无法启动 运行命令regedit,打开注册表编辑器,进入:HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\HTTP]: a) Cha ...

  10. 最近玩Bootstrap , 一些小工具 记录在案。

    最近玩Bootstrap , 一些小工具 记录在案. 1 定制Bootstrap ,所见即所得的修改Bootstrap的各种变量,即时查看样式的变化. http://bootswatchr.com/ ...