Ajax基础：2.原理示例

1.准备一般处理程序ashx，当请求时返回当前服务器时间

    public void ProcessRequest (HttpContext context) {
        context.Response.ContentType = "text/plain";
        context.Response.Write(DateTime.Now.ToString());
    }

2.编写javascript脚本，当然ActiveXObject（“Micsrosoft.XMLTTP”）只能支持IE

    <script type="text/javascript" language="javascript">
        function btnc() {
            //创建xmlhttp对象
            var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            if (!xmlhttp) {
                alert("创建xmlhttp对象异常")
                return false;
            }
            xmlhttp.open("POST", "GetDate.ashx?ts=" + new Date(), false);
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4) {
                    //状态吗是200表示成功
                    if (xmlhttp.status == 200) 
                    {
                        document.getElementById("txtTime").value = xmlhttp.responseText;
                    } else {
                            alert("返回数据错误");
                      }}
            }
            //发送请求
            xmlhttp.send();
        }
    </script>

 3.Jquery方式，做了很好的封装，使用起来很方便

            $.post("GetDate.ashx", function (data, texStatus) {
                $("#txtTime").val(data+texStatus);
            });

 $.post("GetDate.ashx",{"key":zhi;"id":1} function (data, texStatus)

 

4.示例：输入账号查出密码来

 1）处理程序，取出传递来的参数name,查出数据,判断是否查到了相应数据

            string name=context.Request["name"];
            Admin data=AdminManager.getadminbyName(name);
            if (data.Id<=0)
            {
                context.Response.Write("none|0");
            }
            else
            {
                context.Response.Write("ok|"+data.Pwd);
            }

2）编写jquery代码

    <script type="text/javascript">
        $(function () {
            $("#txtName").blur(function () {
                var name = $("#txtName").val();
                
                $.post("GetPwd.ashx", { "name": name }, function (data, status) {
                    if (status == "success") {
                        var arrs = data.split("|");
                        if (arrs[0] == "ok") {
                            $("#txtPwd").val(arrs[1]);
                        }
                        else if (arrs[0] == "none") {
                            alert("mei you");
                        } else {
                            alert("cuo wu");
                        }
                    }
                    else {
                        alert("ajax cuo wu");
                    }
                });
            });
        });
    
    </script>