html ajax put请求,关于前端接口 jquery的ajax请求

关于jquery中ajax请求

一.ajax语法

$.ajax({键值对});

$.ajax({

//四种请求方式大写 GET POST PUT DELETE

type: "POST",

//接口地址或发送请求的地址

url: "http://localhost:9015/u9 api/"，

//如果接口指定有发送请求头，那么需要写headers

headers: { "键 ":"值" },

//默认异步true, 同步为false。

aysn:true,

//发送到服务器的数据，如果是json数据，需要数据转换为 data:JSON.stringify(对象名), 或data:JSON.stringify({键：值})

data: { "键 ":"值" }，

//服务器返回数据类型，此行默认可以不写，如是json格式需要写明 dataType:"json"

dataType: "json",

//向服务器发送的编码类型，此行默认可以不写。如果是json格式需要写明 contentType:"application/json;charset=UTF-8"

contentType:"application/x-www-form-urlencoded",

//接口成功函数，就可以在此对data数据进行操作

success:function(data){ console.log("成功"); },

//返回错误信息

error:function(message){ console.log(message); }

});

二. 四种请求方式

最基本的方法有4种，分别是GET，POST，PUT，DELETE。

get是从服务器上获取数据，post是向服务器传送数据。get和post只是一种传递数据的方式，get也可以把数据传到服务器。

1.get请求

GET请求的数据会附在URL之后(就是把数据放置在HTTP协议头中)，以?分割URL和传输数据，多个参数用&连接

url=http://XXX.com？name=zhangsan&password=123456

GET提交的数据会在地址栏中显示出来，而POST提交，地址栏不会改变

var a={ u_id:1 , as_phone:"15611589313" };

$.ajax({

url:"http://localhost:9015/u9_app_api/cart?u_id="+$("#u_id").val(),

type:"GET", //此行可以不写，默认就是get方式

success:function(data){

console.log("成功");

}

});

2.post请求

POST的安全性要比GET的安全性高，

(1)因为get方式用户名和密码明文出现在url上面。

(2)登录页面有可能被浏览器缓存。

(3)其他人查看浏览器的历史纪录，那么就可以拿到你的账号和密码了，

2.1 默认格式

var user={ u_name:"15611589313" , u_pwd:"123456aa"};

$.ajax({

url:"http://localhost:9015/u9_app_api/coupons_orders",//sale_services",

type:"POST",

data:user,

success:function(data){

console.log("成功");

}

});

2.2 json格式请求

var user={ u_name:"15611589313" , u_pwd:"123456aa"};

$.ajax({

url:"http://localhost:9015/u9_app_api/coupons_orders",//sale_services",

type:"POST",

data:JSON.stringify(user),

dataType:"json",

contentType:"application/json", //json格式这三行必须有

success:function(data){

console.log("成功");

}

});

2.3 序列化表单值

$.ajax({

type: "POST",

url:'http://192.168.10.16:8081/u9_app_api/imgs/imgupload',

data:$("#editFormu").serialize(), // 你的form表单id

success: function(data) {

console.log("成功");

},

error: function(message) {

console.log(message);

}

});

serialize() 方法通过序列化表单值，创建URL编码文本字符串。您可以选择一个或多个表单元素(比如 input或文本框)，或者 form 元素

本身。序列化的值可在生成 AJAX 请求时用于URL 查询字符串中。

语法：$(selector).serialize( )

输出：a=1&b=2&c=3&d=4&e=5

注释：只会将”成功的控件“序列化为字符串。如果不使用按钮来提交表单，则不对提交按钮的值序列化。如果要表单元素的

值包含到序列字符串中，元素必须使用 name 属性。

2.3 FormData

3.put请求

同上

4.delete 请求

同上

三、常用的状态码

◆ 200 (OK): 找到了该资源，并且一切正常。

◆ 304 (NOT MODIFIED): 该资源在上次请求之后没有任何修改。这通常用于浏览器的缓存机制。

◆ 401 (UNAUTHORIZED): 客户端无权访问该资源。这通常会使得浏览器要求用户输入用户名和密码，以登录到服务器。

◆ 403 (FORBIDDEN): 客户端未能获得授权。这通常是在401之后输入了不正确的用户名或密码。

◆ 404 (NOT FOUND): 在指定的位置不存在所申请的资源。

◆ 500 服务器错误

四、重新加载数据

table.ajax.reload();

jquery 的 DataTables 表格插件

4.1 每30秒重新加载表数据(分页重置)

var table = $('#example').DataTable( {

ajax: "data.json"

} );

setInterval( function () {

table.ajax.reload();

}, 30000 );

4.2 每30秒重新加载表数据(分页留存)

var table = $('#example').DataTable( {

ajax: "data.json"

} );

setInterval( function () {

table.ajax.reload( null, false ); // 刷新表格数据，分页信息不会重置

}, 30000 );

4.3 使用回调函数来更新外部元素

var table = $('#example').DataTable();

table.ajax.reload( function ( json ) {

//这里的json返回的是服务器的数据

$('#myInput').val( json.lastInput );

} );

标签：jquery,function,请求,json,接口,ajax,POST,data

来源： https://blog.csdn.net/u010257154/article/details/115708183