在注释中实现top和step函数的Ajax示例代码

效果大致如下：。

对javascript使用jquery。创建一个新的Asp.net网络项目，并使用NuGet获得最新版本的Jquery。

数据库方面使用Nhibernate，用安装包Nhibernate引用。数据库是用的PostgreSQL，安装包Npgsql把驱动装上。我这里偷个懒，数据库名，用户名和密码都是ajaxDemo了。创建数据库：复制代码代码如下：创建数据库“AJaxdemo”拥有者=“AJaxDemo”编码=“UTF8”表空间=pg _ default LC _ COLLATE=”中文(简体)_中华人民共和国。936' LC_CTYPE='中文(简体)_中华人民共和国。936 ' CONNECTION LIMIT=-1；nhibernate配置文件：复制代码代码如下：可扩展标记语言版本='1.0 '编码='utf-8 '？休眠-配置xmlns=' urn :休眠-配置-2.2 '会话-工厂属性名称='连接。driver _ class ' nhibernate。司机。npgsqldriver/属性属性名称='连接。“connection _ string”服务器=localhost数据库=ajaxDemo用户ID=AJaxDemoPassword=AJaxDemo/property属性名称='方言NHibernate。方言。PostgreSQLDialect/属性映射程序集=' AJaxDemo '/映射/会话-工厂/休眠-配置顺带说一句nhibernate的配置模板是错的，改初始目录为数据库。我没有使用nhibernate的一对多映射（主要是觉得用不上),实体类有两个信息和回顾。复制代码代码如下：使用系统；使用系统。集合。通用；使用系统Linq .使用系统网络.使用Iesi .集合。通用；命名空间AjaxDemo .模态{公共类Info { public virtual int Id { get设置；}公共虚拟字符串内容{获取设置；} } }复制代码代码如下：使用系统；使用系统。集合。通用；使用系统Linq .使用系统网络.命名空间AjaxDemo .modal { public class Review { public virtual int Id { get；设置；} public virtual int InfoId { get设置；}公共虚拟字符串内容{获取设置；}公共虚拟int Support { get设置；}公共虚拟int反对派{获取设置；} } }业务层是对应的代码就不贴了。主要就是添加和修改功能。准备工作到此基本完成了，现在来实现我们所需要的功能Ajax。最大的特点是可以仅向服务器发送并取回必需的数据，它使用肥皂或其它一些基于可扩展置标语言或Json的页面服务接口，并在客户端采用Java脚本语言处理来自服务器的响应。因为服务器和客户端之间的数据交换的数据大量减少，结果我们就能看到回应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成，所以网服务器的处理时间也减少了。也就是我们需要两个部分的东西：1.客户端的处理，基于JQuery2 .服务器端的处理，我选用的一般处理程序(ashx)，因为返回的数据很简单，所以没有可扩展标记语言和json。先来看服务端，我们需要获取用户顶或踩的是哪条评论，所以需要id，顶和踩的处理我写在一起，所以还需要一个参数来区分。获取到两个参数以后先根据状态判断是踩还是顶，然后更新相应条目，服务端返回一个代表当前对应数目的数字ChangeState.ashx:复制代码代码如下：使用系统；使用系统。集合。通用；使用系统Linq .使用系统网络.使用AjaxDemo .BLL；使用AjaxDemo .模态；命名空间AjaxDemo .Ajax { ///summary ///返回更新以后的数目////摘要公共类ChangeState : IHttpHandler { public void process request(HttpContext上下文)上下文){ int state=int .解析（上下文请求。查询字符串[' state '])；int id=int .解析（上下文请求。查询字符串[' id '])；审核服务RS=新审核服务()；审查r；开关（状态){案例0: r=rs .updateSupport(id)；语境。回应。写作（支持);打破；案例1: r=rs .更新在野(id)；语境。回应。写（反对);打破；} } public bool IsReuse { get { return false；} } } }再说客服端，因为用的JQuery，活就很少了。使用的$.得到方法。先请求服务端，传入两个参数：状态和id，收到服务端数据后更改状态。

主要代码：复制代码代码如下：功能更改(id，状态){ $。get(' ./Ajax/ChangeState.ashx '，{ id: id，state: state }，函数（数据，文本状态){ if(文本状态==' success '){ switch(状态){ case 0: $(' # Support ' id).文本('顶("数据"));打破；案例1: $("#反对派“身份证”.文本('踩("数据"));打破；} } });}页面代码：复制代码代码如下：%@页面语言=' c# ' AutoEventWireup=' true '代码在=' view detail '之前。aspx。cs ' Inherits=' AJaxDemo .查看详细信息" %！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' head runat=' server '脚本src=//www .JB 51。net/htynkn/archive/2012/01/31/' Scripts/jquery-1 get ' ./Ajax/ChangeState.ashx '，{ id: id，state: state }，函数（数据，文本状态){ if(文本状态==' success '){ switch(状态){ case 0: $(' # Support ' id).文本('顶("数据"));打破；案例1: $("#反对派“身份证”.文本('踩("数据"));打破；} } });}/脚本/标题正文表单id='基本表单' runat='服务器' div id='信息详细信息' H4标题/H4 h1 ASP :标签ID=' infoContent ' runat=' server ' Text=' '/ASP :标签/h1 /div div id='reviews' h4评论/H4 asp:中继器ID='审阅列表' runat='服务器'标题模板ul/标题模板FooterTemplate/ul/footerttemplate项目模板li % #数据绑定器.评估（容器。数据项，"内容" %/li div复制代码代码如下： a onclick=' change(% # DataBinder).评估（容器。数据项，"标识")%,0)标识="支持%#数据链接器。评估（容器. DataItem，“Id”)%”href=//www .JB 51。net/htynkn/archive/2012/01/31/' # '顶(%# DataBinder .评估（容器数据项目，“支持”)%)/aa onclick=' change(% # data binder .评估（容器数据项目，“标识”)%，1)标识=”反对派%# DataBinder .评估（容器. DataItem，“Id”)%”href=//www .JB 51。net/htynkn/archive/2012/01/31/' # '踩(%# DataBinder .评估（容器数据项目反对派)%)/a/div/项目模板/asp:中继器/div/表单/正文/html效果

结尾：1。这篇文章主要是关于一些一般的做法，不完整，不完整。很多错误没有处理，细节没有研究。2.web method也可以在服务器端使用，尤其是在修改现有项目时，只需在客户服务端为javascript调用保留方法即可。我想知道ashx和webmethod哪个更好。3.单元测试纯粹是为了方便…不要喷4的配置模板。n冬眠…一开始我挣扎了很久…5。相关库和软件的版本。集合3 . 2 . 0 . 4000 jquery 1 . 7 . 1n hibernate 3 . 2 . 0 . 4000n PGSQL 2 . 0 . 11 nunit 2。