Jquery-第五课.pptVIP

Jquery-第五课 Ajax jQuery提供了若干个ajax函数，他们大同小异，只是为了处理不同类型的数据而分开来。最简单的是get(url,parameters,callback),这个函数发起一个GET请求，将服务器返回的数据传递给callback处理。 下面的例子实现了当鼠标悬浮在超链接上的时候，就发起一个ajax请求，从服务器端返回关于此超链接的更多介绍的效果。先看服务器端代码，新建一个ajaxload.ashx,仅作为示例，获得查询参数为word的值，并返回： using System; using System.Web; public class MyHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = text/plain; string word = context.Request.Params[word]; context.Response.Write(string.Format(p style=color:red;标签内容为：{0}/p, word)); } public bool IsReusable { get { return false; } } } 前台代码如下： head titleAjax Text/title script type=text/javascript src=jquery-1.4.js/script script type=text/javascript $(function() { $(a).hover(function(event) { $.get(ajaxload.ashx, { word: $(event.target).html() }, function(data) { $(#result).html(data); }); }, function() {$(#result).html(); }); }); /script /head body a href=javascript:void(0)China/abr / a href=javascript:void(0)USA/abr / a href=javascript:void(0)Japan/abr / a href=javascript:void(0)中 国/abr / div id=result /div /body 将鼠标依次滑过Japan和中国，在firebug中可以清楚的看到发起了两次get请求。jquery将参数编码后传递给服务器。在jQuery的帮助下，ajax如此简单。 在此例中，服务器端返回了一个html片段，前台所作的工作就是把这个html片段插入到页面中去，实际上，服务器端返回的可以是任何格式的数据，只要在前台做相应的处理即可。在各种数据格式中，尤为常用的是JSON格式。关于JSON格式本身，本文不多做介绍。简单说，JSON格式非常类似于javascript中的对象字面量。{}表示一个对象，[]表示一个数组。 下面来实现一个三级联动下拉菜单 这是一个捆绑销售商品选择器，先选择第一个属性Game，再选择Server，最后选择Amount。服务器端如何从数据库查找到合适的数据并且如何将其序列化成JSON数据不是本文讨论的重点。服务器端能响应如下请求，返回的数据也能看到，这些是JSON的典型格式： 第一个请求返回Game的列表，第二个请求返回Server的列表，第三个稍微复杂一点，返回了很多信息，其中DisplayName是用来显示在列表中的，ID是列表的value值，其余的没有用到。例如 Amount:select name=SelectAmount id=SelectAmountoption value=4510 Mil/option option value=4620 Mil/option/select 下面介绍前台的实现。下拉列表框的HTML代码如下： div id=bannerLivechat_content p Game:select id=SelectGame/select/p p Server:select id=SelectServer/select/p p Amount:select id=SelectAmount name=SelectAmount/select/p p asp:Button ID=ButtonFasyBuy CssClass=btn_d