关于jq ajax封装以及ajax上传Webapi
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的更多相关文章
- 一个ajax实现表单上传文件的神器 formdata
通过传统的form表单提交的方式上传文件: $.ajax({ url : "http://localhost:8080/STS/rest/user", type : "P ...
- Ajax+PHP实现异步上传多张图片
Ajax+PHP实现异步上传多张图片 HTML代码 <!-- date: 2018-04-27 13:46:55 author: 王召波 descride: 多张图片上传 --> < ...
- spring mvc ajax异步文件的上传和普通文件上传
表单提交方式文件上传和ajax异步文件上传 一:首先是我在spring mvc下的表单提交方式上传 ssm的包配置我就不一一详细列出来了,但是上传的包我还是列出来 这一段我也不知道怎么给大家讲解就是直 ...
- PHP+Ajax+plupload无刷新上传头像代码
很简单的一款PHP+Ajax+plupload无刷新上传头像代码,兼容性很好,可以直接拿来用.你可以自定义各种类型的文件.本实例中只能上传"jpg", "png" ...
- Ajax实现文件的上传
Ajax实现文件的上传 准备 ajax的参数补充 type不写的话默认是GET dataType和ContentType: dataType: 浏览器发给服务器希望返回的数据类型 .. 如果明确地指定 ...
- egg.js 通过 form 和 ajax 两种方式上传文件并自定义目录和文件名
egg.js 通过 form 和 ajax 两种方式上传文件并自定义目录和文件名 评论:10 · 阅读:8437· 喜欢:0 一.需求 二.CSRF 校验 三.通过 form 表单上传文件 四.通过 ...
- SpringMVC+Ajax实现文件批量上传和下载功能实例代码
需求: 文件批量上传,支持断点续传. 文件批量下载,支持断点续传. 使用JS能够实现批量下载,能够提供接口从指定url中下载文件并保存在本地指定路径中. 服务器不需要打包. 支持大文件断点下载.比如下 ...
- jQuery+php+ajax实现无刷新上传文件功能
jQuery+php+ajax实现无刷新上传文件功能,还带有上传进度条动画效果,支持图片.视频等大文件上传. js代码 <script type='text/javascript' src='j ...
- 基于vue-simple-uploader封装文件分片上传、秒传及断点续传的全局上传插件
目录 1. 前言 2. 关于vue-simple-uploader 3. 基于vue-simple-uploader封装全局上传组件 4. 文件上传流程概览 5. 文件分片 6. MD5的计算过程 7 ...
随机推荐
- Spring事务管理要点总结
# Spring事务管理要点总结 ### 要点---- 事务是企业级应用中必不可缺少的技术,用来确保数据的完整性和一致性.- Spring事务管理并不实现事务管理的实现,而是借助Hibernate\J ...
- 6. 集成学习(Ensemble Learning)算法比较
1. 集成学习(Ensemble Learning)原理 2. 集成学习(Ensemble Learning)Bagging 3. 集成学习(Ensemble Learning)随机森林(Random ...
- jQuery 实现前端模糊匹配与首字母搜索
实现效果 源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <t ...
- CACTI命令行添加DEVICE/GRAPH/TREE
有时要加入大量的机器到 Cacti ,直接修改 Cacti 还是很复杂的.所以最好还是通过他本身提供的工具来实现. Cacti 早就为我们想到过这个问题了.这些工具就在 cacti/cli 目 ...
- sam9260 adc module
/* * driver/char/at91_adc.c * * Copyright (C) 2007 Embedall Technology Co., Ltd. * * Analog-to-digit ...
- Android keytool 生成keystore与给APK签名
http://www.tttabc.com/android/keytool-keystore-jarsigner-apk.htm
- jstorm之于storm
关于流处理框架,在先前的文章汇总已经介绍过Strom,今天学习的是来自阿里的的流处理框架JStorm.简单的概述Storm就是:JStorm 比Storm更稳定,更强大,更快,Storm上跑的程序,一 ...
- Hbase 学习(五) 调优
1.垃圾回收器调优 当我们往hbase写入数据,它首先写入memstore当中,当menstore的值大于hbase.hregion.memstore.flush.size参数中设置的值后,就会写入硬 ...
- w3svc无法启动
w3svc无法启动 运行命令regedit,打开注册表编辑器,进入:HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\HTTP]: a) Cha ...
- 最近玩Bootstrap , 一些小工具 记录在案。
最近玩Bootstrap , 一些小工具 记录在案. 1 定制Bootstrap ,所见即所得的修改Bootstrap的各种变量,即时查看样式的变化. http://bootswatchr.com/ ...