深入浅出Ajax(一)

客户端:

  <script type="text/javascript">
        window.onload = initPage;

        function initPage()
        {
            var btn = document.getElementById("btnOK");
            btn.onclick = function ()
            {
                getDetails(this.title);//按钮单击发送请求
            }
        }

        function getDetails(obj)
        {
            request = createRequest(); //创建请求对象
            if (request == null)
            {
                alert("没有请求对象!");
                return;
            }
            var url = "DetailForm.aspx?title=" + escape(obj);//向何处发请求
            request.open("GET", url, true); //请求方式
            request.onreadystatechange = displayDetails;//函数引用,设置回调函数
            request.send(null);//没有随请求发送额外东西
        }

        function displayDetails()
        {
            if (request.readyState == 4)
            {
                if (request.status == 200)
                {
                    document.getElementById("btnOK").value = request.responseText;
                }

            }
        }
        function createRequest()
        {
            try
            {
                request = new XMLHttpRequest();
            } catch (tryMS)
            {
                try
                {
                    request = new ActiveXObject("Msxml2.XMLHTTP");
                } catch (otherMS)
                {
                    try
                    {
                        request = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (failed)
                    {
                        request = null;
                    }
                }
            }
            return request;
        }

        //完全看不到页面的刷新,却从服务器端拿回了数据!
    </script>
<body>
    <form id="form1" runat="server">
        <div>
            <input type="button" id="btnOK" value="Ok" title="确定" />
        </div>
    </form>
</body>

服务端:

 public partial class DetailForm : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string str = Request.QueryString["title"];
            if (str != null && str != "")
            {
                Response.Write("new_" + str);
            }
            else
            {
                Response.Write("nothing");
            }
            Response.End();
        }
    }
原文地址:https://www.cnblogs.com/hometown/p/3237164.html