AJAX请求 $.post方法的使用_H5之家 - 中国HTML5教程资源分享第一站

使用jQuery的$.post方法可以以POST形式向服务器发起AJAX请求。$.post方法是jQuery的实用工具方法。

$.post方法语法

$.post(url,parameters,callback)

参数

url

(字符串)服务器端资源地址。

parameter

(对象)需要传递到服务器端的参数。参数形式为“键/值”。

callback

(函数)在请求完成时被调用。该函数参数依次为响应体和状态。

返回值

XHR实例

看个简单的例子

客户端代码：

<head>

$().ready(function () {

　　$('#selectNum').change(function () {

　　　　var idValue = $(this).val();

　　　　//采用POST方式调用服务

　　　　$.post('Server.aspx', { id: idValue }, function (text, status) { alert(text); });

　　})

</script>

</head>

<body>

　　<option value="0">--Select--</option>

</select>

</body>

</html>

复制代码

服务端

protected void Page_Load(object sender, EventArgs e)

{

　　if (!Page.IsPostBack)

　　{

　　　　if (Request["id"] != null && !string.IsNullOrEmpty(Request["id"].ToString()))

　　　　{

　　　　　　Response.Write( GetData(Request["id"].ToString()));

　　　　}

protected string GetData(string id)

{

　　string str = string.Empty;

　　switch (id)

　　{

　　　　case "1":

　　　　　　str += "This is Number 1";

　　　　　　break;

　　　　case "2":

　　　　　　str += "This is Number 2";

　　　　　　break;

　　　　case "3":

　　　　　　str += "This is Number 3";

　　　　　　break;

　　　　default:

　　　　　　str += "Warning Other Number!";

　　　　　　break;

　　}

　　return str;

}

复制代码

务观
echo

AJAX请求 $.post方法的使用

使用jQuery的$.post方法可以以POST形式向服务器发起AJAX请求。$.post方法是jQuery的实用工具方法。

$.post方法语法

$.post(url,parameters,callback)

参数

url

(字符串)服务器端资源地址。

parameter

(对象)需要传递到服务器端的参数。参数形式为“键/值”。

callback

(函数)在请求完成时被调用。该函数参数依次为响应体和状态。

返回值

XHR实例

看个简单的例子

客户端代码：

[size=1em]

[backcolor=rgb(244, 244, 244) !important]1

[backcolor=rgb(244, 244, 244) !important]3

[backcolor=rgb(244, 244, 244) !important]5

[backcolor=rgb(244, 244, 244) !important]7

[backcolor=rgb(244, 244, 244) !important]9

[backcolor=rgb(244, 244, 244) !important]11

[backcolor=rgb(244, 244, 244) !important]13

[backcolor=rgb(244, 244, 244) !important]15

[backcolor=rgb(244, 244, 244) !important]17

[backcolor=rgb(244, 244, 244) !important]19

[backcolor=rgb(244, 244, 244) !important]21

[backcolor=rgb(244, 244, 244) !important]23

[backcolor=rgb(244, 244, 244) !important]<html xmlns="[color=rgb(0, 0, 0) !important]">
<head>
[backcolor=rgb(244, 244, 244) !important]<title></title>
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
[backcolor=rgb(244, 244, 244) !important]<script type="text/javascript">
$().ready(function () {
[backcolor=rgb(244, 244, 244) !important]　　$('#selectNum').change(function () {
　　　　var idValue = $(this).val();
[backcolor=rgb(244, 244, 244) !important]　　　　//采用POST方式调用服务
　　　　$.post('Server.aspx', { id: idValue }, function (text, status) { alert(text); });
[backcolor=rgb(244, 244, 244) !important]　　})
})
[backcolor=rgb(244, 244, 244) !important]</script>
</head>
[backcolor=rgb(244, 244, 244) !important]<body>
<select id="selectNum">
[backcolor=rgb(244, 244, 244) !important]　　<option value="0">--Select--</option>
　　<option value="1">1</option>
[backcolor=rgb(244, 244, 244) !important]　　<option value="2">2</option>
　　<option value="3">3</option>
[backcolor=rgb(244, 244, 244) !important]</select>
</body>
[backcolor=rgb(244, 244, 244) !important]</html>

服务端主要代码：

[size=1em]

[backcolor=rgb(244, 244, 244) !important]1

[backcolor=rgb(244, 244, 244) !important]3

[backcolor=rgb(244, 244, 244) !important]5

[backcolor=rgb(244, 244, 244) !important]7

[backcolor=rgb(244, 244, 244) !important]9

[backcolor=rgb(244, 244, 244) !important]11

[backcolor=rgb(244, 244, 244) !important]13

[backcolor=rgb(244, 244, 244) !important]15

[backcolor=rgb(244, 244, 244) !important]17

[backcolor=rgb(244, 244, 244) !important]19

[backcolor=rgb(244, 244, 244) !important]21

[backcolor=rgb(244, 244, 244) !important]23

[backcolor=rgb(244, 244, 244) !important]25

[backcolor=rgb(244, 244, 244) !important]27

[backcolor=rgb(244, 244, 244) !important]29

[backcolor=rgb(244, 244, 244) !important]31