jquery.ajax([options])
概述:通过 http 请求加载远程数据。
jquery 底层 ajax 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 xmlhttprequest 对象。使用这个方法可以获得更多的灵活性。
数据类型
$.ajax()函数依赖服务器提供的信息来处理返回的数据。通过datatype选项还可以指定其他不同数据处理方式。其中,text和xml类型返回的数据不会经过处理。如果指定为html类型,任何内嵌的javascript都会在html作为一个字符串返回之前执行。如果指定为json类型,则会把获取到的数据作为一个javascript对象来解析,并且把构建好的对象作为结果返回。发送数据到服务器,默认情况下,ajax请求使用get方法。如果要使用post方法,可以设定type参数值。这个选项也会影响data选项中的内容如何发送到服务器。
使用场景一:
描述:保存数据到服务器,成功时显示信息。jquery 代码:
$.ajax({
type: post,
url: some.php,
data: name=john&location=boston,
success: function(msg){
alert( data saved: + msg );
}
});
使用场景二:
描述:装入一个 html 网页最新版本。jquery 代码:
$.ajax({
url: test.html,
cache: false,
success: function(html){
$(#results).append(html);
}
});
load(url, [data], [callback])
概述:载入远程 html 文件代码并插入至 dom 中。
默认使用 get 方式 - 传递附加参数时自动转换为 post 方式。
使用场景一:
描述:加载 feeds.html 文件内容。jquery 代码:
$(#feeds).load(feeds.html);
jquery.get(url, [data], [callback], [type])和jquery.post(url, [data], [callback], [type])
概述:通过远程 http get或post 请求载入信息。
这是一个简单的 get或post 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。
描述:显示 test.aspx 返回值(html 或 xml,取决于返回值),添加一组请求参数。jquery 代码:
$.get(test.aspx, { name: john, time: 2pm },
function(data){
alert(data loaded: + data);
});
$.post(test.aspx, { name: john, time: 2pm },
function(data){
alert(data loaded: + data);
});
上面是基本的语法,我们只是先做一个了解,要是你已经熟悉,那么我们将开始一步一步对上面的方法和使用场景进行具体讨论。
二:jquery.ajax伴随asp.net的实战练习
首先创建default.aspx页面,作为请求发起页面,并会获得返回值。页面的代码default.aspx是:
复制代码 代码如下:
ajax:
resulthtml:
load:
get:
post:
default.aspx.cs里面有没写任何代码,默认即可。
请求的接受者这里面有三种角色:response.aspx页面、test.htm静态页面和textjson.txt。response.aspx页面:主要是在服务器端获得客户端提交的数据,并返回数据给客户端。
test.htm静态页面:主要是给客户端局部装入一个html网页最新版本。
textjson.txt:是作为数据储存在文件中,让客户端来异步访问的。
response.aspx页面代码,response.aspx是:
没有任何html代码,因为主要是在服务器端获得客户端提交的数据,并返回数据给客户端,不需要显示html内容,所以可以不含html标记。
response.aspx.cs页面代码:
复制代码 代码如下:
using system;
using system.collections.generic;
using system.linq;
using system.web;
using system.web.ui;
using system.web.ui.webcontrols;
using system.runtime.serialization.json;
using system.runtime.serialization;namespace jqueryajax2
{
public partial class response : system.web.ui.page
{
protected void page_load(object sender, eventargs e)
{
string str = request[key1];
response.write(success + str);
}
}
}
在代码中可以看到服务器端获得客户端提交的数据,并返回数据给客户端的方式。test.htm静态页面的代码是:
复制代码 代码如下:
test.html
当静态页面被请求后,会作为html的格式返回客户端,使用 $(#resulthtml).append(html);这样的方法来显示test.htm静态页面的内容。textjson.txt里面保存着一段文本,是json格式的:
{ key1: 刘明丰, key2: 林望, key3: 陈文杰, key4: 耿殿佳 }
在被访问后返回的是json格式的数据,在客户端获得json后会自动转换成对象。
好了,jquery的异步使用场景基本满足我们的需求,自己试试看吧。
