jQuery中ajax的使用

$ .ajax()方法概述

在jQuery中也为大家封装好了一些ajax方法。内部会自动将data对象转换成x-www-form-urlencoded的形式,data中我们也可以传递字符串。如果要传递json格式数据,需要设置contentType和将data写成json字符串的形式(可以用JSON.stringify方法转换)

作用:发送Ajax请求。

1.jQuery中ajax的基本使用

url:请求地址

type:请求方式

get或者post

data:发送到服务器的数据(将自动转换为请求字符串格式)

发送到服务器的数据,格式是json格式或者json字符串格式。如果是 GET 请求,系统就通过 url 传递;如果是 POST 请求,系统就通过设置请求体传递。

success:请求成功的回调函数

该回调函数中的第一个参数是服务器返回的数据(拿到的只是数据),它会自动根据服务端响应的 Content-type 自动转换为对象,如果服务端没有设置响应头Content-type,返回的还是字符串类型的数据。

javascript 复制代码
		$.ajax({
            url: 'demo.json',
            type: 'post',
            data: {
                id: 1,
                name: '张三'
            },
            success: function (res) {
                console.log(res);
            }
        });

还有一个参数,dataType要注意一下

javascript 复制代码
		$.ajax({
            url: 'demo.json',
            type: 'get',
            // 设置的是请求参数
            data: {
                id: 1,
                name: '张三'
            },
            dataType: 'json', // 用于设置响应体的类型 注意 跟 data 参数没关系!!!
            success: function (res) {
                // 一旦设置的 dataType 选项,就不再关心 服务端 响应的 Content-Type 了
                // 客户端会主观认为服务端返回的就是 JSON 格式的字符串
                console.log(res);
            }
        });
相关推荐
王大师王文峰2 天前
HTML 入门到进阶:语义化标签、表单与多媒体一篇打通【语义化布局、表单校验、video/audio、Canvas、无障碍与 SEO】
前端·css·node.js·html·css3·jquery·html5
小羊没烦恼!3 天前
Ajax与JSON的一些总结
android·java·前端·数据库·mysql·算法·okhttp
脉动数据行情4 天前
Java OkHttp 对接国际期货批量行情 SpringBoot 定时落库实践
java·spring boot·okhttp
变与不变8065 天前
jQuery 核心语法与 jQuery AJAX
前端·ajax·jquery
ycydynq5 天前
django用Bootstrap 模态框 在同一页面实现增删改查
django·bootstrap·jquery
牧瀬クリスだ9 天前
Ajax入门:从原生XHR到axios实战
java·spring boot·ajax·okhttp
传人once12 天前
选择文件按钮样式如何美化
前端·html·css3·jquery·html5
墨天梦13 天前
B15_HTTP解析与OkHttp拦截器
网络协议·http·okhttp
传人once15 天前
网页文字滚动效果如何做
前端·css·html·jquery·html5
传人once15 天前
多图片上传预览功能如何写
前端·css·html·jquery·html5