jQuery ajax 标准写法及进度条绘制

$.ajax({
url: "http://www.microsoft.com", //请求的url地址
dataType: "json", //返回格式为json
async: true, //请求是否异步,默认为异步,这也是ajax重要特性
data: {
"id": "value"
}, //参数值
type: "GET", //请求方式
processData: false, //对表单data数据是否进行序列化
contentType: false, //dataType设置你收到服务器数据的格式
xhr: function() { //ajax进度条
var xhr = $.ajaxSettings.xhr();
if (onprogress && xhr.upload) {
xhr.upload.addEventListener("progress", progressBar, false);
return xhr;
}
},
beforeSend: function() {
//请求前的处理
},
success: function(req) {
//请求成功时处理
},
complete: function() {
//请求完成的处理
},
error: function() {
//请求出错处理
}
});

下面是ajax进度条执行的方法

/**
* 侦查附件上传情况,这个方法大概0.05-0.1秒执行一次
*/
function progressBar(evt) {
var loaded = evt.loaded; //已经上传大小情况
var tot = evt.total; //附件总大小
var per = Math.floor(100 * loaded / tot); //已经上传的百分比
//这里可以绘制进度条
}

jQuery ajax 标准写法及进度条绘制的更多相关文章

  1. jquery ajax标准写法

    $.ajax({ url:url,                      //地址 type:'post', //请求方式 还可以是get type不可写成Type 不让会导致数据发送不过去,使用 ...

  2. jquery ajax 标准写法

    $.ajax({ url:"http://www.microsoft.com", //请求的url地址 dataType:"json", //返回格式为json ...

  3. ajax标准写法

    ajax 标准写法 $.ajax({ url:"http://www.microsoft.com", //请求的url地址 dataType:"json", / ...

  4. Ajax上传文件进度条显示

    要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...

  5. jquery ajax分页写法

    jquery ajax分页写法我用的是laypage插件 前端代码<pre> function demo(curr) { $.getJSON('/home/index/getinfo', ...

  6. JQuery的Ajax标准写法

    Ajax的标准写法 $.ajax({ url:"http://www.xxx",//请求的url地址 dataType:"json",//返回的格式为json ...

  7. jQuery模拟页面加载进度条

    因为我们无法通过任何方法获取整个页面的大小和当前加载了多少,所以想制作一个加载进度条的唯一办法就是模拟.那要怎么模拟呢? 我们知道,页面是从上往下执行的,也就是说我们可以大致估算出在页面的某个位置加载 ...

  8. H5+Ajax+WebApi实现文件下载(进度条,多文件)

    前言 踩过的坑 1.WebAPI跨域 2.Jquery ajax低版本不支持XHR 2功能 3.Jquery ajax不支持Deferred的process事件 4.IE下文件名乱码问题 功能实现 & ...

  9. jQuery上传文件显示进度条

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script sr ...

随机推荐

  1. Spring Cloud架构

    Spring Cloud主要的组件,以及它的访间流程  1.外部或者内部的非 Spring Cloud目都统一通过API网关(Zuul)来访可内部服务.  2.网关接收到请求后,从注册中心( Eure ...

  2. Windows系统Python 安装第三方模块时,提示pip版本有问题

    如果按照提示输入python -m pip install --upgrade pip 还不行, 那么执行easy_install --upgrade pip 即可 参考:https://stacko ...

  3. Android 开发之:Intent.createChooser() 妙用

    大家对该功能第一印象就是ApiDemo 里面的 其只有区区几行代码  提取为: Intent intent = new Intent(Intent.ACTION_GET_CONTENT); inten ...

  4. 【python】判断字符串以什么开头或结尾

    项目中用到python判断一个字符串是否以某个字符串结尾,比如,筛选一个目录下所有以.mp4结尾的文件. >>> item = "demo.mp4" >&g ...

  5. Python编码规范 -- Python Style Guide

    Python代码风格规范. @1:参数缩进:(2种形式) <1> foo = long_function_name(var1, var2, var3, var4) #第1行有参数, 第2行 ...

  6. 曾经跳过的坑----js截取字符串substr与substring 和 trim

    不废话直接代码.自己理解...... > "abcdefg".substring(1,6)> "bcdef"> "abcdefg&q ...

  7. iOS9 Search API 之 Spotlight

    iOS9以后 有三种api提供搜搜方式 加强引导用户关注 我们的app及相关内容的方式 NSUserActivity Web Markup  Core Spotlight 用法 前两种 实战操作性不够 ...

  8. $ python正则表达式系列(1)——正则元字符

    本文主要介绍python中正则表达式的基本用法,做一个初步的认识. 1. 初识 python通过re内置模块来处理正则表达式(regex),底层使用C引擎.一个简单的正则匹配的例子: import r ...

  9. hostname -f 失败解决办法

    $ hostname fzk $ uname -n fzk 当 hostname -f 时报错:未搜索到主机名 产生这个原因时因为  /etc/hosts和/etc/sysconfig/network ...

  10. springboot-项目属性配置

    springboot如何新建一个项目参考博客:https://www.cnblogs.com/junyang/p/8151802.html 在springboot默认生成的配置文件的格式是:appli ...