在上一次的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. MyBatis框架Maven资源

      <!-- MyBatis框架 --> <dependency> <groupId>org.mybatis</groupId> <artifac ...

  2. MySQL 存储php中json_encode格式中文问题及解决

    MySQL 存储php中json_encode格式信息  ,遇到中文时, 会变成一堆类似uxxxx信息. 1. 原因分析:在存储到数据库时!MySQL 不会存储 unicode 字符: MySQL 仅 ...

  3. bug数量问题研究

    最近感觉很扯蛋的事情就是测试人员提bug的问题.先说下前提,公司测试会以提bug数量来做为一部分员工绩效的成份.再说一下公司从需求到开发 到测试,先是需求出一个文档,开发根据文档做功能的开发,然后测试 ...

  4. C#get,set

    一直对get,set的理解只在文字上:get 属性访问器用于返回属性值,而 set 访问器用于分配新值.其实这样理解是有点狭隘的,尤其是对set.set应该可以理解为为成员分配新值时的处理,比如一个类 ...

  5. [Js]高级运动

    一.链式运动框架 1.他需要一个回调函数,在运动停止时,开始下一次运动(执行函数) 多物体运动框架改为如下: function startMove(obj,attr,iTarget,fn){ ... ...

  6. POJ 2255 Tree Recovery 树的遍历,分治 难度:0

    http://poj.org/problem?id=2255 #include<cstdio> #include <cstring> using namespace std; ...

  7. NOIP2009解题报告

    09年的题总体来说 没有难题,但是每道题除了第一题都要认真的慢慢写才能AC, 第一题: R国和S国正陷入战火之中,双方都互派间谍,潜入对方内部,伺机行动. 历经艰险后,潜伏于S国的R国间谍小C终于摸清 ...

  8. RHEL 6.3安装(超级详细图解教程)[转载]

        附:RHEL6.3下载地址 32位:http://rhel.ieesee.net/uingei/rhel-server-6.3-i386-dvd.iso 64位:http://rhel.iee ...

  9. GET /hello/fred/0926xxx572

    GET /hello/fred/0926xxx572 app.get('/hello/:name/:tel', function(req, res) { console.log(req.params. ...

  10. JDBC 连接池

    数据库连接池(connection pool) JDBC数据库连接池的必要性 在使用开发基于数据库的web程序时,传统的模式基本是按以下步骤: 在主程序(如servlet.beans)中建立数据库连接 ...