Home > Web Front-end > JS Tutorial > Detailed explanation of the usage of get method and post method in jquery.ajax()

Detailed explanation of the usage of get method and post method in jquery.ajax()

伊谢尔伦
Release: 2017-06-19 10:19:39
Original
1771 people have browsed it

1. $.get() requests data from the server through HTTP GET request.

Syntax structure:

$.get(url, [data], [callback], [type]);
Copy after login

Parameter analysis:

1.URL: required, specifies the requested URL.
2.data: Optional, Key/value parameters to be sent.
3.callback: Optional, the callback function executed after the request is successful.
4.type: Optional, return content format, xml, html, script, json, text, _default.

Code example:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.php.cn/" />
<title>php.cn</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){
  $("#bt").click(function(){
    $.get("mytest/demo/antzone.txt",function(data,status){
      alert("Data:"+data+"\nStatus:"+status);
    })
  })
})
</script>
</head>
<body>
<input type="button" value="查看效果" id="bt"/>
</body>
</html>
Copy after login

2. The $.post() method requests data from the server through HTTP POST request.

Syntax structure:

$.post(URL,data,callback);
Copy after login

Parameter analysis:

1.URL: Must, specifies the URL of the request.
2.data: Optional, specifies the data to be sent with the request.
3.callback: Optional, specifies the function name to be executed after the request is successful.

Code example:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.php.cn/" />
<title>php.cn</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){
  $("#bt").click(function(){
    $.post("mytest/demo/antzone.html",function(data,status){
      alert("Data:"+data+"\nStatus:"+status);
    })
  })
})
</script>
</head>
<body>
<input type="button" value="查看效果" id="bt"/>
</body>
</html>
Copy after login

This is a simple POST request function to replace the complex $.ajax. The callback function can be called when the request is successful. If you need to execute a function on error, use $.ajax.

$.post(
  &#39;http://www.php.cn/ajax.php&#39;,
  {Action:"post",Name:"lulu"},
  function(data,textStatus){
    //data可以是xmlDoc,jsonObj,html,text,等等.
    //this;//这个Ajax请求的选项配置信息,请参考jQuery.get()说到的this
    alert(data.result);
  },
  "json"//这里设置了请求的返回格式为"json"
);
Copy after login

If you set the request format to "json" and you do not set the ContentType returned by Response to: Response.ContentType = "application/json"; then you will not be able to capture the returned data.

Note that in the above example alert(data.result); since the Accept header is set to "json", the data returned here is an object, so there is no need to use eval() to convert it to object.

The above is the detailed content of Detailed explanation of the usage of get method and post method in jquery.ajax(). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template