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", "/Search.aspx?q=" + encodeURI(str), 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
|
open() 方法已調用，但是 send() 方法未調用。請求還沒有被髮送。
|
|
2
|
Send
|
Send() 方法已調用，HTTP 請求已發送到 Web 服務器。未接收到響應。
|
|
3
|
Receiving
|
所有響應頭部都已經接收到。響應體開始接收但未完成。
|
|
4
|
Loaded
|
HTTP 響應已經完全接收。
|