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. node.js 关于跨域和传递给前台参数

    /*为app添加中间件处理跨域请求*/ app.use(function(req, res, next) { res.header("Access-Control-Allow-Origin& ...

  2. JS HTML DOM---Document对象

    Document 对象 当浏览器载入 HTML 文档, 它就会成为 document 对象. document 对象是HTML文档的根节点与所有其他节点(元素节点,文本节点,属性节点, 注释节点). ...

  3. diy 重要的不是这个工具怎么解决了问题

    w 0-这个工具解决了什么问题? 1-diy,怎么解决这个工具解决了的问题? 2-是否diy实现?实现了,对比,优化:反之,分析借鉴,吸收优化. 重要的不是git怎样解决了git已经解决的问题.

  4. geometric mean

    w

  5. Python菜鸟之路:DOM基础

    前言 DOM 是 Document Object Model(文档对象模型)的缩写,定义了访问和操作 HTML 文档的标准方法.DOM把网页和脚本以及其他的编程语言联系了起来.DOM属于浏览器,而不是 ...

  6. XE2安装JVCL

    XE2安装JVCL1. 下载:要分别下载JCL和JVCL安装包,不可以图省事不下载前者.http://sourceforge.net/projects/jcl/files/JCL%20Releases ...

  7. 登录案例locustfile.py

    # 保存为locustfile.py # coding=utf-8 from locust import HttpLocust, TaskSet, task ''' 实现场景:先登录(只登录一次),然 ...

  8. ShutIt:一个基于 Python 的 shell 自动化框架

    ShutIt是一个易于使用的基于shell的自动化框架.它对基于python的expect库(pexpect)进行了包装.你可以把它看作是“没有痛点的expect”.它可以通过pip进行安装. Hel ...

  9. 卸载SQL Server 2008 (R2)

    一.卸载SQL Server 2008 (R2) 1.找到控制面板,win8及win7都可以直接点解“开始”按钮找到. (Tip:win10系统的小盆友可以在“开始”菜单下点击“所有应用”,找到win ...

  10. YAMLException: can not read a block mapping entry; a multiline key may not be an implicit key at line 5, column 1:

    创建的md文件头部声明中没有加空格.