`
luckyjaky
  • 浏览: 112125 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

AJAX五步使用法及中文乱码处理！

Ajax浏览器ASP.netSafariASP 
阅读更多

   也是从《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;
        }
    }

}

分享到：
| asp.net上传文件
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics