您的位置：首页 > Web前端 > JQuery

jquery之利用ajax与服务器交谈(发起GET和POST请求之利用jquery获取数据)

2011-04-10 16:41 931 查看

jquery之利用ajax与服务器交谈(发起GET和POST请求之利用jquery获取数据)

----------

load()命令发起GET或POST请求，取决于是否带请求数据进行调用，但有时候我们想对使用哪种HTTP方法进行更多的控制。为什么我们应该关心这件事件？因为，也许是服务器在乎这件事件。

web作者过去使用GET和POST方法很轻松随意，使用这个或那个而不太留意HTTP协议规定如何使用这些方法。关于这两个方法的规定如下：

GET请求：服务器的状态和应用的模型数据应该不受GET操作的影响。同样的GET操作，进行第一次第二次第三次..应该返回完全一致的结果。

POST请求：发送到服务器的数据可以用来修改应用的模型状态。例如，给数据库添加记录或从服务器删除信息。

因此，GET请求应该用来获取数据。可能需要利用GET请求给服务器发送一些数据。但如果发送数据到服务器是为了实现一个修改，就应该使用POST请求。

jquery给我们提供几个办法用于生成请求，与load()不同，不是以操作包装集的jquery命令方式来实现的。而是提供几个实用工具函数来生成不同类型的请求。jquery实用工具函数是顶层函数，它们的命名空间为全局名称jQuery或别名$。

利用JQuery获取数据

如果我们想要从服务器获取一些数据然后决定进行什么处理(而不是由load()命令把它设置为一个HTML元素的内容)，可以利用$.get()实用工具函数。

$.get()语法：

$.get(url,parameters.callback)

利用指定的URL，带着任何已传入的参数作为查询字符串而向服务器发起GET请求

参数

url (字符串)将要通过GET方法进行交互的服务器端资源的URL

parameters (对象/字符串)一个对象，其属性作为"名称/值对"用于构造查询字符串并追加到URL;或者一个预先格式化的和URL编码的查询字符串。

callback (函数)回调函数，在请求完成时被调用。响应体作为第一个参数传递到这个回调函数，响应状态则作为第二个参数传递到这个回调函数。

返回

XHR实例

利用实用工具函数$.get()从服务器获取数据的实例：

]<html>
<head>
<title>$.get() Example</title>
<link rel="stylesheet" type="text/css" href="../common.css" mce_href="common.css">
<mce:script type="text/javascript" src="../scripts/jquery-1.2.1.js" mce_src="scripts/jquery-1.2.1.js"></mce:script>
<mce:script type="text/javascript"><!--
$(function(){
$('#testButton').click(function(){
$.get(
'reflectData.jsp',
{a:1,b:2,c:3},
function(data){alert(data);}
);
});
});

// --></mce:script>
</head>
<body>
<button type="button" id="testButton">Click me!</button>
</body>
</html>

在这个简单的页面里，我们创建并设置按钮，一旦点击就让它发起$.get()函数调用。带着指定的请求参数的值：a,b,c,向服务器资源reflectData.jsp发起GET请求。返回的数据被传递给回调函数，在回调函数里可以对这些数据进行任何处理。

如果响应包含一个xml文档，则文本将被解析，而传递给回调函数的data参数将是作为结果的DOM。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航