也是从《AJAX技术入门》的视频上摘录的代码，觉得蛮有用滴，记下来了，以后要用到AJAX的直接在自己的博客上找就得了，省了GOOGLE的时间，嘿嘿！
效果图如下：只是实现一个简单的用户名验证！
程序使用ASP.NET实现！
Default.aspx页面源码：
Html代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!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>
<title>AJAX五步使用法及中文乱码处理</title>
<script type="text/javascript">
var xmlhttp;
function submit() {
// 1.创建XMLHttpRequest对象
if (window.XMLHttpRequest) {
// IE7,IE8,FireFox,Mozilla,Safari,Opera
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType("text/xml");
}
} else if(window.ActiveXObject) {
// IE6,IE5.5,IE5
var activexName = ["MSXML2.XMLHTTP","Miscrosoft.XMLHTTP"];
for (var i = 0; i <activexName.length; i++) {
try{
xmlhttp = new ActiveXObject(activexName[i]);
break;
} catch(e) {
}
}
}
if (xmlhttp == undefined || xmlhttp == null) {
alert('当前浏览器不支持创建XMLHttpRequest对象，请更换浏览器');
return;
}
//2.注册回调方法
xmlhttp.onreadystatechange = callback;
//错误的写法
//xmlhttp.onreadystatechange = callback();
// 获取文本框中输入的内容，经过两次编码防止中文乱码
var userName = document.getElementById("UserName").value;
userName = encodeURI(encodeURI(userName));
// GET方式交互
// 3.设置和服务器端交互的相应参数
xmlhttp.open("GET","AJAXGB.ashx?name=" + userName,true);
// 4.设置向服务器端发送的数据，启动和服务器端的交互
xmlhttp.send(null);
/*
// POST方式交互
// 3.设置和服务器端交互的相应参数
xmlhttp.open("POST","AJAXGB.ashx",true);
// POST方式交互所需要增加的代码
xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
// 4.设置向服务器端发送的数据，启动和服务器端的交互
xmlhttp.send("name=" + userName);
*/
}
function callback() {
// 5 .判断和服务器端的交互是否完成，还要判断服务器端是否正确返回了数据
if (xmlhttp.readyState == 4) {
// 表示和服务器端的交互已经完成
if (xmlhttp.status == 200) {
// 表示服务器的响应代码是200，正确的返回了数据
// 纯文本数据的接受方法
var message = xmlhttp.responseText;
// XML数据对应的DOM对象的接受方法
// 使用的前提是，服务器端需要设置content-type为text/xml
// var domXml = xmlhttp.responseXML;
//向div标签中填充文本内容的方法
var div = document.getElementById("message");
div.innerHTML = message;
}
}
}
</script>
</head>
<body>
<input type='text' id='UserName' value='牛腩' />
<input type='button' onclick='submit()' value='校验用户名' />
<br />
<div id="message">
</div>
</body>
</html>
一般处理程序AJAXGB.ashx源码:
C#代码:
<%@ WebHandler Language="C#" Class="AJAXGB" %>
using System;
using System.Web;
public class AJAXGB : IHttpHandler {
public void ProcessRequest (HttpContext context) {
context.Response.ContentType = "text/plain";
string old = context.Request["name"];
if (string.IsNullOrEmpty(old))
{
context.Response.Write("用户名不能为空");
}
else
{
string name = context.Server.UrlDecode(old);
if (name.Equals("牛腩"))
{
context.Response.Write("用户名[" + name + "]已经存在，请使用其他用户名！");
}
else
{
context.Response.Write("用户名[" + name + "]尚未存在，可以使用该用户名注册！");
}
}
context.Response.End();
}
public bool IsReusable {
get {
return false;
}
}
}
分享到：
相关推荐
"安全五步工作法"是一种系统化的工作安全流程，旨在提高员工的安全意识和预防事故的能力。这个方法主要包括五个步骤：暂停、思考、识别、确认、执行，适用于各个行业的作业活动，特别是那些潜在风险较高的岗位。 1....
### AJAX五步法详解 **一、创建XMLHttpRequest对象** 在使用AJAX进行异步通信时，第一步至关重要，即创建`XMLHttpRequest`对象。此对象是实现AJAX的核心，允许JavaScript执行HTTP请求，无需重新加载整个网页即可与...
DOU音五步定位法
标题提到的“日文用的FPDF”是指FPDF已经被扩展或配置来正确处理日文字体和编码，解决了在生成PDF时常见的日文乱码问题。 FPDF的核心功能包括： 1. **页面管理**：FPDF可以添加、删除和设置PDF文档的页面大小和...
《五步工作法》.doc
微信三方营销五步成交法
【五步对抗法】是一种专门用于处理人际冲突和提高有效沟通的策略，尤其适用于工作中与不喜欢的人交流或合作的情境。这种方法强调以尊重和确定性的语言来表达自己的观点，旨在减少对抗，增进理解和合作。 **步骤一：...
初中语文语文论文五步教学法初探
克雷斯威尔提出的五步文献综述法，为进行有效的文献梳理提供了实用的框架。下面将详细阐述这五个步骤。 1. 序言：这一部分是文献综述的开篇，主要介绍综述的主要内容和结构，让读者对接下来要探讨的主题有一个大致...
【万科城“五步一法”工作小组】是房地产行业中的一种管理模式，主要针对物业服务的创新与优化。这个工作小组的成立旨在提升服务质量，通过一系列步骤和方法，更好地满足业主需求，增强客户满意度。以下是该模式的...
千贝惠女装销售技巧五步训练法PPT.pptx
服装CAD五步教学法是一种教学策略，其目的就在于通过系统的教学步骤帮助学生理解和掌握这项技术。 第一步是确定目标。教学过程中的每一步都要有明确的目标，目标是学生学习的动力源泉。在服装CAD教学中，教师需要将...
《五步法搞定战略绩效实战设计》是一份深入探讨企业战略绩效管理的参考资料，通过一套系统的方法论，帮助企业实现战略目标与员工绩效的有效对接。在实际应用中，五步法通常包括了明确战略、构建指标、设定目标、执行...
【店铺销售技巧五步训练法】是一门针对零售业销售人员的专业培训课程，旨在提升销售业绩和客户满意度。课程由培训机构Topband TMTM的陈汐主讲，通过五个步骤帮助学员掌握关键销售技能。 第一步是“看”，即观察顾客...
在此背景下，研讨式五步教学法应运而生，并在《前厅管理》课程教学改革中展现出其独特价值与应用效果。 研讨式五步教学法的核心在于将学生置于教学活动的中心，通过科学设计的教学步骤，激发学生的学习兴趣与主动...
th增员面谈五步吸引法城区经理人版37页.pptx
基于python实现五步移相法和提取干涉条纹骨架源码（课程大作业）.zip基于python实现五步移相法和提取干涉条纹骨架源码（课程大作业）.zip基于python实现五步移相法和提取干涉条纹骨架源码（课程大作业）.zip基于...
五步教学法在机械CAD_CAM课程教学中的应用.pdf
【五步放线施工法详解】 装饰工程中的“五步放线施工法”是一种精确的施工定位技术，主要应用于室内装饰工程。这种方法旨在确保装饰施工的设计尺寸与现场实际情况相符，避免施工过程中的误差，提高施工效率，特别是...