jQuery的get()post()getJson()方法

jQuery get() 和 post() 方法用于通过 HTTP GET 或 POST 请求从服务器请求数据。

HTTP 请求：GET vs. POST

两种在客户端和服务器端进行请求-响应的常用方法是：GET 和 POST。

GET - 从指定的资源请求数据
POST - 向指定的资源提交要处理的数据

GET 基本上用于从服务器获得（取回）数据。注释：GET 方法可能返回缓存数据。

POST 也可用于从服务器获取数据。不过，POST 方法不会缓存数据，并且常用于连同请求一起发送数据。

1、jQuery $.get() 方法

$.get() 方法通过 HTTP GET 请求从服务器上请求数据。

语法：

$.get(URL,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 callback 参数是请求成功后所执行的函数名。

下面的例子使用 $.get() 方法从服务器上的一个文件中取回数据：

<!DOCTYPE html>

<html>

<head>

<script src="/jquery/jquery-1.11.1.min.js"></script>

<script>

$(document).ready(function(){

  $("button").click(function(){

    $.get("/example/jquery/demo_test.asp",function(data,status){

      alert("数据：" + data + "\n状态：" + status);

    });

  });

});

</script>

</head>

<body>

<button>向页面发送 HTTP GET 请求，然后获得返回的结果</button>

</body>

</html>

$.get() 的第一个参数是我们希望请求的 URL（"demo_test.asp"）。

第二个参数是回调函数。第一个回调参数存有被请求页面的内容，第二个回调参数存有请求的状态。

提示：这个 ASP 文件 ("demo_test.asp") 类似这样：

<%

response.write("This is some text from an external ASP file.")

%>

2、jQuery $.post() 方法

$.post() 方法通过 HTTP POST 请求向指定的服务器提交要处理的数据

语法：

$.post(URL,data,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 data 参数规定连同请求发送的数据。

可选的 callback 参数是请求成功后所执行的函数名。

下面的例子使用 $.post() 连同请求一起发送数据：

<!DOCTYPE html>

<html>

<head>

<script src="/jquery/jquery-1.11.1.min.js">

</script>

<script>

$(document).ready(function(){

  $("button").click(function(){

    $.post("/example/jquery/demo_test_post.asp",

    {

      name:"Donald Duck",

      city:"Duckburg"

    },

    function(data,status){

      alert("数据：" + data + "\n状态：" + status);

    });

  });

});

</script>

</head>

<body>

<button>向页面发送 HTTP POST 请求，并获得返回的结果</button>

</body>

</html>

$.post() 的第一个参数是我们希望请求的 URL ("demo_test_post.asp")。

然后我们连同请求（name 和 city）一起发送数据。

"demo_test_post.asp" 中的 ASP 脚本读取这些参数，对它们进行处理，然后返回结果。

第三个参数是回调函数。第一个回调参数存有被请求页面的内容，而第二个参数存有请求的状态。

提示：这个 ASP 文件 ("demo_test_post.asp") 类似这样：

<%

dim fname,city

fname=Request.Form("name")

city=Request.Form("city")

Response.Write("Dear " & fname & ". ")

Response.Write("Hope you live well in " & city & ".")

%>

3、getJSON() 方法

jQuery中的$.getJSON( )方法函数主要用来从服务器加载json编码的数据，它使用的是GET HTTP请求。

定义和用法

通过 HTTP GET 请求载入 JSON 数据。

在 jQuery 1.2 中，您可以通过使用 JSONP 形式的回调函数来加载其他网域的 JSON 数据需要在url后面加上“url？callback=？”，如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名，以执行回调函数。注意：此行以后的代码将在这个回调函数执行前执行。

语法

jQuery.getJSON(url,data,success(data,status,xhr))

参数	描述
url	必需。规定将请求发送的哪个 URL。
data	可选。规定连同请求发送到服务器的数据。
success(data,status,xhr)	可选。规定当请求成功时运行的函数。额外的参数： data - 包含来自请求的结果数据 status - 包含请求的状态 xhr - 包含 XMLHttpRequest 对象

参数

描述

url

必需。规定将请求发送的哪个 URL。

data

可选。规定连同请求发送到服务器的数据。

success(data,status,xhr)

可选。规定当请求成功时运行的函数。

额外的参数：

data - 包含来自请求的结果数据
status - 包含请求的状态
xhr - 包含 XMLHttpRequest 对象

详细说明

该函数是简写的 Ajax 函数，等价于：

$.ajax({

  url: url,

  data: data,

  success: callback,

  dataType: json

});

示例

从 test.js 载入 JSON 数据并显示 JSON 数据中一个 name 字段数据：

$.getJSON("test.js", function(json){

  alert("JSON Data: " + json.users[3].name);

});

实例

从http://wx.xxx.com/util/getCode.jsonp载入json数据，由于是从另外一个网域获得json数据所以需要在请求url后面增加“？callback=？”，请求成功后运行function（data）函数。注意data是放回的json数据。这里是设置当前页面上classname=imgcode的元素的值为data.cade值

$.getJSON('http://wx.xxx.com/util/getCode.jsonp?callback=?',function(data){$('.imgcode').val(data.code);})