JQuery Ajax

Ajax

JQuery 对 XMLHttpRequest 对象 的封装更是简化到了极致,让我们能相对优雅的使用 Ajax

$.ajax("url", {
 // 自定义请求头
 headers: {},
 method: 'GET', // POST PUT 默认 GET
 // 请求格式 (服务器根据格式解析数据)
 contentType: 'application/json' // POST 默认 application/x-www-form-urlencoded;charset=UTF-8
 // 发送数据
 data: {}
 // 接受格式
 dataType: 'html' // json text xml
    
}).done(function(data) {
 // 成功调用
 // data 服务器返回的数据
    
}).fail(function (xhr, status) {
 // 失败调用
 // xhr, status 错误的信息

}).always(function () {
 // 无论成功失败

})

上传文件

上传文件其实就是构建一个 multipart formdata 的 HTTP 请求,需要借助 FormData 对象

// 构建数据
var data = new FormData()
data.append('name', $('[name=name]').val())
data.append('file', $('[name=thumb]')[0].files[0]) // file 对象

// 提交
$.ajax('url',{
 method: 'POST',
 data: data,
 processData: false, // 默认 | 不处理数据
 contentType: false // 默认 | 不设置内容类型
 ...
})

/*
 跟普通表单只有一处区别,就是普通表单的数据 data 是一个 json,上传文件是 FormData
*/
JQuery 教程 JQuery 入门 JQuery DOM JQuery 表单 JQuery Ajax JQuery 事件 JQuery 切换效果
更多教程 HTML5 教程 CSS3 教程 JavaScript 教程 JQuery 教程 React.js 教程 Node.js 教程 Koa2 教程 Python 教程 Linux 教程