XMLHttpRequest可以提供不重新加载页面的情况下更新网页
乱码主要是由于js中文传参影响的
解决方法:
xhr.open("post","/Search.aspx?q=" + encodeURI(str),true);
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <Meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery-1.7.min.js" type="text/javascript"></script> <title>解析XMLHttpRequest</title> </head> <body> <form id="ajax" name="ajax" method="post" runat="server"> <div> <input type="text" name="search" id="search" /> <input type="button" name="go" id="go" value="搜索" /> <div id="result"></div> </div> </form> </body> </html> <script type="text/javascript"> var xhr = null; $(function () { $("#go").click(function () { var str = $("#search").val(); if ($.trim(str) == "") { $("#result").html("请输入要搜索的内容."); } else { _search(str); } }); }); function _search(str) { try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) { try { xhr = new XMLHttpRequest(); } catch (e) { alert("您的浏览器不支持ajax."); } } } xhr.onreadystatechange = _CallBack; xhr.open("post",true); xhr.send(null); } function _CallBack() { if (xhr.readyState == 4 && xhr.status == 200) { $("#result").html(xhr.responseText); } } </script>
//search.aspx.cs
using System; namespace MyAjax { public partial class Search : System.Web.UI.Page { protected override void OnPreInit(EventArgs e) { if (!IsPostBack) { if (Request.QueryString["q"] != null) { string str = Server.UrlDecode(Request.QueryString["q"].ToString().Trim()); //清空输出 Response.Clear(); //设置页面无缓存 Response.Buffer = true; Response.ExpiresAbsolute = System.DateTime.Now.AddSeconds(-1); Response.Expires = 0; Response.CacheControl = "no-cache"; Response.AppendHeader("Pragma","No-Cache"); Response.Cache.SetNoStore(); Response.ClearContent(); //输出 Response.Write("您是不是要找:<br />" + str); //结束输出 Response.End(); } } } } }
//方法
abort()
取消当前响应,关闭连接并且结束任何未决的网络活动。
这个方法把 XMLHttpRequest 对象重置为 readyState 为 0 的状态,并且取消所有未决的网络活动。例如,如果请求用了太长时间,而且响应不再必要的时候,可以调用这个方法。
getAllResponseHeaders()
把 HTTP 响应头部作为未解析的字符串返回。
如果 readyState 小于 3,这个方法返回 null。否则,它返回服务器发送的所有 HTTP 响应的头部。头部作为单个的字符串返回,一行一个头部。每行用换行符 "" 隔开。
getResponseHeader()
返回指定的 HTTP 响应头部的值。其参数是要返回的 HTTP 响应头部的名称。可以使用任何大小写来制定这个头部名字,和响应头部的比较是不区分大小写的。
该方法的返回值是指定的 HTTP 响应头部的值,如果没有接收到这个头部或者 readyState 小于 3 则为空字符串。如果接收到多个有指定名称的头部,这个头部的值被连接起来并返回,使用逗号和空格分隔开各个头部的值。
open()
//open(method,url,async,username,password)
初始化 HTTP 请求参数,例如 URL 和 HTTP 方法,但是并不发送请求。
send()
发送 HTTP 请求,使用传递给 open() 方法的参数,以及传递给该方法的可选请求体。
setRequestHeader()
向一个打开但未发送的请求设置或添加一个 HTTP 请求。
//属性
状态
|
描述
|
|
0
|
Uninitialized
|
初始化状态。XMLHttpRequest 对象已创建或已被 abort() 方法重置。
|
1
|
Open
|
|
2
|
Send
|
|
3
|
Receiving
|
所有响应头部都已经接收到。响应体开始接收但未完成。
|
4
|
Loaded
|
HTTP 响应已经完全接收。
|