在上一次的Ajax操作中，我们使用了ASP.NET原生控件实现，但是弊端很多，效率低下，而且有个文件上传的BUG：http://blog.csdn.net/zhaoqiliang527/article/details/4457961。

　　于是我们寻求更好的实现方式，jQuery的Ajax方法配合ashx一般处理程序。jQuery的好处是兼容性强（背后有一个团队专门负责开发），易用（找个API几分钟就学会了），功能强大（对原生js进行了封装，直接调用方法即可实现很多功能）。Ashx一般处理程序则是MS自家的，从名字可以看出它是用来处理一些东西的（原谅我才疏学浅），而且它在执行的过程中不会对整个页面的生命周期重建，这就避免了控件树生成带来的开销问题。好了，下面我们来讲讲，这两者如何结合可以实现ajax，首先我们建立一个页面：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ashxAjax.aspx.cs" Inherits="WebApplication1.ashxAjax" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">

    <title>jQuery实现Ajax</title>

    <script type="text/javascript" src="JavaScript/jquery-11.js"></script>

    <script type="text/javascript">

        $(function () {

            $("#txtId").blur(function () {

                var a = $("#txtId").val();

                $.ajax({

                    type: "post",

                    url: "Handler1.ashx",

                    data: { m: a },

                    success: function (result) {

                        var res = result.toString();

                        $("#lblShow").html(res);

                    }

                });

            });

        });

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        昵称：<asp:TextBox ID="txtId" runat="server"></asp:TextBox><asp:Label ID="lblShow" runat="server"

            ForeColor="Red"></asp:Label><br />

    </div>

    </form>

</body>

</html>

　　在这里面我在页面头部引用了最新的jQuery-1.11（好吧那个js文件名字没取好），然后在页面放入一个文本框用于输入昵称，同时在后面有个Label，用于显示用户名是否被注册的消息。

　　接下来我们就可以用到jQuery的ajax方法，在本例中，我们的需求是输入昵称后，文本框失去焦点，然后检测该昵称是否存在，于是就有了$("#txtId").blur方法。接下来失去焦点后，我们需要获取文本框的值，然后向ashx文件发起ajax请求：$.ajax({type: "post",url: "Handler1.ashx",data: { m: a },success: function (result) {var res =result.toString();$("#lblShow").html(res);}});

　　注意这几个参数一定要写全，首先是提交的方式，我们这里用的是post的方式。然后是URL，就是我们的ashx文件的路径，接下来是参数，在这里我们传入文本框输入的昵称。最后有个success，它表示在请求成功后后续的操作，这里我们是将处理的结果用于Label文字的显示。

　　在前端写好js后，我们来看看我们的ashx文件中的代码：

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

namespace WebApplication1

{

    /// <summary>

    /// Handler1 的摘要说明

    /// </summary>

    public class Handler1 : IHttpHandler

    {

        public void ProcessRequest(HttpContext context)

        {

            context.Response.ContentType = "text/plain";

            string Name = context.Request.Params["m"].ToString();

            if (userHelper.CheckName(Name) == false)

            {

                context.Response.Write("该昵称已被注册！");

            }

            else

            {

                context.Response.Write("恭喜，此昵称可以使用！");

            }

        }

        public bool IsReusable

        {

            get

            {

                return false;

            }

        }

    }

}

　　在这个ashx文件中，我们先将传进来的名称作为参数，去调用我们上一节的userHelper类检测昵称是否存在，然后在返回值后再返回不同的文字，用于显示，我们来一起看看效果：

　　此时发现失去焦点后，代码已经进入断点，这表明我们的ajax请求已经成功！

　　而根据数据库所示：豆豆这个昵称是存在的，因此我们会在userHelper类中进行处理，并返回false之后，提示用户该昵称已经存在：

　　我们再来看看输入一个不存在的：最终的结果是提示用户可以使用。

这样表明我们已经实现了jQuery+ashx一般处理程序的方式实现了无页面刷新检测用户名的ajax方式。

　　目前在大多数企业开发中，这种ajax实现方式用的较为广泛，它不仅操作容易，而且是轻量级实现，ashx可以返回json字符串，也可以返回xml文件，极为灵活，所以推荐大家都使用这种方式去实现ajax。但是这样的ajax依然不是最原始的实现方式，因为ajax的本意是“Asynchronous Javascript + XML”（异步JavaScript和XML），下次我们一起来探索最后一种用原生的javascript去实现ajax功能的方式，敬请期待！

ASP.NET之Ajax系列（二）的更多相关文章

  1. [转]ASP.NET MVC学习系列(二)-WebAPI请求 传参

    [转]ASP.NET MVC学习系列(二)-WebAPI请求 传参 本文转自:http://www.cnblogs.com/babycool/p/3922738.html ASP.NET MVC学习系 ...

  2. ASP.NET MVC学习系列(二)-WebAPI请求

    继续接着上文 ASP.NET MVC学习系列(一)-WebAPI初探 来看看对于一般前台页面发起的get和post请求,我们在Web API中要如何来处理. 这里我使用Jquery 来发起异步请求实现 ...

  3. ASP.NET MVC学习系列(二)-WebAPI请求(转)

    转自:http://www.cnblogs.com/babycool/p/3922738.html 继续接着上文 ASP.NET MVC学习系列(一)-WebAPI初探 来看看对于一般前台页面发起的g ...

  4. ASP.NET MVC学习系列(二)-WebAPI请求 转载https://www.cnblogs.com/babycool/p/3922738.html

    继续接着上文 ASP.NET MVC学习系列(一)-WebAPI初探 来看看对于一般前台页面发起的get和post请求,我们在Web API中要如何来处理. 这里我使用Jquery 来发起异步请求实现 ...

  5. ASP.NET之Ajax系列（三）

    我们通过前两篇文章的学习,已经大致掌握了Ajax的实现方法,同时也可以对比出两种方式的优劣.但是我们还是没有搞清楚真正的ajax的实现原理,以及最原始的,未经过封装的ajax是什么样的,今天我们一起来 ...

  6. ASP.NET之Ajax系列（一）

    我们在Web开发中经常会接触到Ajax技术,同时Ajax技术也有很多种实现方式,那么,我们今天从第一种方式说起:ASP.NET原生控件实现Ajax. ASP.NET原生控件用于Ajax技术的主要是Up ...

  7. Asp.Net生命周期系列二

    在上回书开始的时候我们提到博客园的IIS看了一眼我的请求后就直接交给ASP.NET去处理了,并且要求ASP.NET处理完之后返回HTML以供展示. 那么我们不仅要问: 1,    IIS肯定是没有眼睛 ...

  8. ASP.NET Core部署系列二：发布到CentOS上

    前言: 在上一节中,通过一系列的步骤,已经将项目部署到IIS上,虽然遇到了一些问题,但最终解决并成功运行了.而在这一节中,将尝试通过linux系统的环境下,部署项目,实现Net Core跨平台的亮点. ...

  9. Asp.Net生命周期系列三

    上文讲到了HttpRunTime主要做了三个事情,我们先回忆一下. 第一:雇佣了项目经理(HttpApplication). 第二:建立了HttpModule列表,项目经理(HttpRunTime)就 ...

随机推荐

  1. (11)odoo权限机制

    -----------------更新时间:10:21 2016-09-29 星期四14:31 2016-09-28 星期三 权限对象命名修改18:06 2016-09-18 星期日11:55 201 ...

  2. 注解配置springMvc及向作用域中赋值

    1.在applicationContext.xml中配置包扫描器 <!-- 使用注解配置扫描器 --> <context:component-scan base-package=&q ...

  3. 识别低效率的SQL语句

    1.返回行与逻辑读的比率 CREATE TABLE t as select * from dba_objects; --CREATE INDEX idx ON t (object_id); ---例1 ...

  4. 3D开发的基本知识

    为了实现3D图形,程序员需要定义两个方面的数据: 1.3D图形的每个顶点(Vertex)的位置,每个顶点的位置都需要X.Y.Z三个左标值. 2.3D图形每个面由哪些顶点组成. Android的3D坐标 ...

  5. HDU 4046 Panda

    线段树单点更新,要注意两段合并多出的答案的计算即可 //======================================================================== ...

  6. java使用JDBC连接数据库

    1.下载connectors/j: 地址:http://www.mysql.com/downloads/connector/j/ 选择 到此页面点击“No,thanks……" 若使用Java ...

  7. POJ 1739

    楼教主男人八题之一... 题目大意: 求从左下角经过所有非障碍点一次到达右下角的方案数 这里不是求回路,但是我们可以考虑,在最下面一行再增加一行,那么就可以当做求此时左下角到右下角的回路总数,那么就转 ...

  8. jpcap

    1.System.out.println( System.getProperty("java.library.path")); 2.将jpcap.dll放到上边打印的路径中

  9. PL/SQL : Procedural Language / Structual Query Language and it is an exrension to SQL.

    SQL is not very flexible and it cannot be made to react differently to differing sutuations easily. ...

  10. Android ContentProvider的实现

    当Android中的应用需要访问其他应用的数据时,用ContentProvider可以很好的解决这个问题.今天介绍一下ContentProvider的用法. 首先开发ContentProvider有两 ...