谈谈 ajax 的不同用法

1. $.ajax() 是jquery通用的一个ajax 封装，语法：$.ajax( 选项 ) , 选项是一个对象

常用参数：

　　声明一个变量获取phone值：var xPhone = $(‘#xPhone‘).val();

　　$.ajax({

　　　　url：“a.php” ("/api/ser"),　　　　　　　　　　　　　　　　//发送请求的地址

　　　　data: { phone: xPhone,  name: $("#username").val() }, 　　// data:{ 后台接口的参数名：页面获取到的变量 }

　　　　type: ‘post‘ ,　　　　　　　　　　　　　　　　　　　　  //type默认是get　　

　　　　datatype: "json",　　　　　　　　　　　　　　　　　　// datatype 指定服务器返回的数据类型

　　　　success: function(data){　　　　　　　　　　　　　　 //　success 是请求成功后的回调函数 ，可以根据需要做一些判断操作

　　　　　　console.log("请求成功了");

　　　　　　if(data.ret_id === 200){

　　　　　　　　alert("提交成功");

　　　　　　　　window.location.href = "index.html";　　// 页面重定向

　　　　　　}

　　　　},

　　　　error: function(e){　　　　　　　　　　　　　　　　//请求失败时调用

　　　　　　console.log("服务器请求失败")；

　　　　}

　　})；

2. $.get() 使用get 方式进行ajax异步请求，语法： $.get(url  [,data]  [,callback] ),

　　参数解释：url: ajax请求的地址。data: 可选参数，对象类型，发送到服务器的数据会显示在请求的url中。callback: 可选参数，ajax请求成功时自动调用该函数。

例子：status 状态码

　　$.get("b.php", {phone: xPhone,  name: $("#username").val(), id: ‘111‘}, function(data,status){

　　　　console.log(data)

　　　　if(status === 200){

　　　　　　console.log("请求成功");　　　　

　　　　}else{

　　　　　　console.log("请求失败");

　　　　}

　　});

3. $.post()  使用 post 方式进行ajax异步请求, 语法：$.post(url [,data ] [,callback][,type]),　比$.get()多了一个type参数

例子：表单提交的时候请求 ajax

　　$("#form1").submit(function(e){

　　　　e.preventDefault();　　//阻止表单默认提交

　　　$.post("./js/a.json", {phone: xPhone, age: xAge}, function(data){

　　　　　　if(data.ret_cd === 200){

　　　　　　　　alert("留言成功");

　　　　　　}else{

　　　　　　　　alert("留言失败");

　　　　　　}

　　　}, "json")　　　　　　　　　　　　// type: 请求的数据类型(有html xml  json)，设置为 json, 则返回的格式是json格式的，不设置默认和$.get()返回的一样，是字符串格式

})

4. $.getJSON(): 用于ajax获取json数据，语法: $.getJSON(url [,data] [,callback]) ，参数解释同$.get() $.post()

　　$.getJSON可以通过把请求url写成"aaa.php?callback=X" , 让程序执行回调函数X。 

　　缺点：发送的数据量不能太多，否则造成url太长接收失败

谈谈 ajax 的不同用法

原文：https://www.cnblogs.com/ly2646/p/10854029.html