Ajax学习日志

在IE浏览器中发送Ajax请求

浏览器端的代码

 
<!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></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function btnClick() {
             var xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); //创建XMLHTTP对象
            if (!xmlHttp) {                                        //判断xmlHttp对象是否创建成功
                alert("创建xmlHttp对象异常!");
                return false;
            }
            xmlHttp.open("POST", "GetDate.ashx?ts=" + encodeURI("哈哈"), false); //准备向服务器的GetDate发出post请求
            //XMLHTTP默认（也推荐）不是同步请求的，也就是open方法并不等服务器响应数据才返回，而是监听服务器
            //返回的数据，因此需要监听onreadystatechange事件。
            xmlHttp.onreadystatechange = function () {
                if (xmlHttp.readyState == 4) {
                    if (xmlHttp.status == 200) {//如果状态码为200则是成功
                        alert(xmlHttp.responseText);//responseText是服务器返回的文本
                        document.getElementById("Text1").value = xmlHttp.responseText;
                    }
                    else {
                        alert("Ajax服务器错误");
                    }
                }
            }
            xmlHttp.send();
        }
    
    </script>
</head>
<body>
    <input type="text" id="Text1" name="name" value=" " />
    <input type="button" id="Button1" name="btnGetData" onclick="btnClick()" value=" " />
</body>
</html>

服务器端的代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace testAjax
{
    /// <summary>
    /// GetDate 的摘要说明
    /// </summary>
    public class GetDate : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            string time = context.Request["ts"];
            context.Response.ContentType = "text/plain";
            context.Response.Write(DateTime.Now.ToString() + time);
        }

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

一些要记录的点：

1、在get、post的选择上：使用get方式可能直接从浏览器的缓冲里面取数据，用post请求将会直接从服务器端取数据，往往没有缓冲的问题。

2、JQuery发送Ajax的方式：$.get()、$post.()、$.Ajax()。其中$.ajax()函数是JQuery中提供的ajax访问代码。$.post()是对$.ajax()的post方式提交ajax查询的封装，$.get()是对$.ajax()的get方式提交ajax查询的封装。

3、如果有请求的参数，则在ajax请求的第二个参数用字典方式来设置。

$.post(“GetDate1.ashx”,{“id”:1},   function(data,textStatus) {}   )。在ajax的请求中，Jquery为我们进行了URI编码，因此参数中有中文也不用担心。

第三个参数是匿名函数，其中data表示服务器相应Ajax请求发回来的值，textStatus表示请求的状态值。

posted @ 2013-03-14 09:46  陈哈哈  阅读(395)  评论(0)  编辑  收藏  举报