首先引入ajax.js文件 创建xmlhttpRequest对象

Code
//创建XMLHttpRequest对象
var xmlHttp;
function newXMLHttpRequest() {

if (window.XMLHttpRequest) {
        xmlHttp = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        try { 
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e1) { 
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e2) {
            } 
        }
     }
       return xmlHttp;
}

//发起异步请求
function sendRequest(){
    newXMLHttpRequest();
    var url="AjaxHandler.ashx?name="+document.getElementById("txtName").value;
      xmlHttp.open("GET",url,true);
    xmlHttp.onreadystatechange=onSuccessCallBack;
    xmlHttp.send(null);
}

//回调处理函数
function onSuccessCallBack(){
    if (xmlHttp.readyState == 4) 
    {
        if (xmlHttp.status == 200) 
        {
            document.getElementById("result").innerHTML = xmlHttp.responseText;
        } 
        else 
        {
            document.getElementById("result").innerHTML=result.status;
        }
    }
}

//HTTP 处理程序
   IHttpHandler 接口:定义 ASP.NET 为使用自定义 HTTP 处理程序同步处理 HTTP Web 请求而实现的协定。
如果您的处理程序将访问会话状态值，它必须实现 IRequiresSessionState 接口（不包含任何方法的标记接口）。 
创建自定义 HTTP 处理程序

若要创建自定义 HTTP 处理程序，请创建实现 IHttpHandler 接口的类来创建一个同步处理程序。或者，可以实现 IHttpAsyncHandler 来创建一个异步处理程序。两种处理程序接口都要求您实现 IsReusable 属性和 ProcessRequest 方法。 IsReusable 属性指定 IHttpHandlerFactory 对象（实际调用适当处理程序的对象）是否可以将处理程序放置在池中，并且重新使用它以提高性能。如果处理程序不能放在池中，则在每次需要处理程序时工厂都必须创建处理程序的新实例。

ProcessRequest 方法负责处理单个 HTTP 请求。在此方法中，将编写生成处理程序输出的代码。

HTTP 处理程序有权访问应用程序上下文。其中包括请求用户的标识（如果已知）、应用程序状态和会话信息。当请求 HTTP 处理程序时，ASP.NET 将调用相应处理程序的 ProcessRequest 方法。您在处理程序的 ProcessRequest 方法中编写的代码将创建一个响应，此响应随后发送回请求浏览器。

Code
using System;
using System.Collections;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;

namespace Ajax
{
    /// <summary>
    /// $codebehindclassname$ 的摘要说明
    /// </summary>
    [WebService(Namespace = "http://tempuri.org/")]
    [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class AjaxHandler : IHttpHandler
    {

public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";//显示html原代码.
            //response.ContentType ="image/gif" 
            //response.ContentType ="image/jpeg" 
            //response.ContentType ="text/html" 
            string name = context.Request.QueryString["name"];
            context.Response.Write(name.ToUpper());
        }

public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}

前台页面:

Code
<head runat="server">
    <title>XMLHttpRequest+WebForm模式</title>
    <script type="text/javascript" src="Ajax.js"></script>
</head>
<body>
<input type="text" id="txtName" />
<input type="button" value="Request" onclick="JavaScript:sendRequest();" />
<hr />
<div id="result"></div>
</body>
</html>

或者通过客户端向另一个页面传递参数,由该页面处理数据,把结果输出到http流中 
 apsx.cs页面
   public partial class AjaxForm : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                string name = Request.QueryString["name"];
                Response.Write(name.ToUpper());
                Response.Flush();
                Response.End();
            }
        }
    }

//xmlhttpRequest对象
   //发起异步请求
function sendRequest(){
    newXMLHttpRequest();
    var url="AjaxForm.aspx?name="+document.getElementById("txtName").value;
   xmlHttp.open("GET",url,true);
    xmlHttp.onreadystatechange=onSuccessCallBack;
    xmlHttp.send(null);
}

转载于:https://www.cnblogs.com/hubcarl/archive/2009/09/15/1567251.html

XMLHttpRequest+WebForm模式(接口IHttpHandler)实现ajax相关推荐

  1. Ajax调用springboot接口,Springboot解决ajax+自定义headers的跨域请求问题.pdf

    Springboot解解决决ajax+自自定定义义headers的的跨跨域域请请求求问问题题 1..什什么么是是跨跨域域 由于浏览器同源策略 (同源策略,它是由Netscape提出的一 著名的安全策略 ...

  2. STM32的下载及调试模式 接口

    使用的最多的调试方式莫过于 JTAG  和SWD方式. JTAG: JTAG(Joint Test Action Group,联合测试行动小组)是一种国际标准测试协议(IEEE 1149.1兼容),主 ...

  3. php微信支付使用ajax,微信扫码支付模式二支付状态Ajax轮询实例

    Ajax 轮训支付状态代码: //设置每隔1000毫秒执行一次load() 方法 setInterval(function(){load()},1000); function load(){ var ...

  4. 微信支付ajax实现支付,微信扫码支付模式二支付状态Ajax轮询实例

    Ajax 轮训支付状态代码: //设置每隔1000毫秒执行一次load() 方法 setInterval(function(){load()},1000); function load(){ var ...

  5. 关于前端接口 jquery的ajax请求

    关于jquery中ajax请求 一.ajax语法 二. 四种请求方式 1.get请求 2.post请求 2.1 默认格式 2.2 json格式请求 2.3 序列化表单值 2.3 FormData 3. ...

  6. 简单工厂模式-接口在设计模式中的应用之一

    接口在设计模式中的应用之一:简单工厂模式 无工厂:手工 缺点:麻烦,对每一个的要求都比较高 优点:个性化 工厂:生产产品 优点:批量生产,使用者比较方便,直接买 缺点:无法定制,如果非要定制就会比较麻 ...

  7. html与java接口_html用ajax请求服务器后端java接口跨域问题解决

    在html页面加入以下代码: 在java后端代码的接口中加入 response.setHeader("Access-Control-Allow-Origin", "*&q ...

  8. 微信公众平台开发[12]-开发模式-接口-天气

    天气接口也是一个很常用的接口,我使用的是中国天气网天气预报接口,市面上大都使用的是这个接口. 中国天气网提供了三个接口: http://www.weather.com.cn/data/sk/10101 ...

  9. android省电模式 接口,了解是否启用了省电模式 – Android SDK

    在评论之后 根据我的经验,三星以及HTC是以最难以预测的方式修改Android操作系统的制造商之一.它们增加了新的功能和模式,如4G切换启动器小部件和"省电模式".他们修改了记录的 ...

最新文章

  1. webstorm常用设置
  2. 性能分布式NewLife.XCode对无限数据的支持
  3. SQL 聚合函数一定要跟group by以及NULL的关系的案例精讲
  4. 找回创新能力 才是苹果的救命稻草
  5. Linux终端复用神器-tmux初探
  6. SNF快速开发平台2019-APP移动端实际应用效果
  7. 机器学习书籍资料推荐
  8. SQLPlus获取oracle表操作SQL
  9. murmurhash java_浅析ketamahash和murmurhash
  10. 装linux系统为什么会黑屏_Ubuntu安装时出现黑屏问题的解决
  11. workbench动力学周炬_ANSYS WORKBENCH有限元分析实例详解(动力学)
  12. java excel多选_POI生成可多选下拉框excel
  13. html5怎么设置表格背景颜色,Echart 如何设置表格内的背景颜色?
  14. 妈妈见我来了的香港旅游局
  15. 怎样使用word的朗读文本功能
  16. 500G技术资源分享
  17. 2011深信服校园招聘笔试面试
  18. 一文读懂 | 数据中台如何为企业赋能？
  19. 微信客服为什么不能人工服务器,微信客服消息格式限制及功能
  20. PPP概念股一览 PPP概念股盈利预测

热门文章

  1. c语言程序设计的日志,C语言程序设计教学日志.docx
  2. 上传自己的项目到github
  3. 荣耀系统更新服务器不可用,荣耀确认系统更新方式 4月1日前发布的机型固件升级由华为负责...
  4. 已知函数func的C语言代码框架,第三章习题-ddg..doc
  5. 项目的ar指什么_AR眼镜显示测评标准解读——概述
  6. main()函数参数
  7. 深度系统如何安装mysql_deepin 安装mysql apache
  8. 埃斯顿机器人 王杰高_埃斯顿自动化王杰高博士受邀赴韩参加“ROBOT WORLD 2016”等一系列相关活动...
  9. [Leetcode456]132模式 - 单调栈
  10. hhkb mac设置_把 HHKB 放在 MacBook 上使用的解决方案