简易解析ajax,javascript-XMLHttpRequest，解决乱码问题

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	open() 方法已调用，但是 send() 方法未调用。请求还没有被发送。
2	Send	Send() 方法已调用，HTTP 请求已发送到 Web 服务器。未接收到响应。
3	Receiving	所有响应头部都已经接收到。响应体开始接收但未完成。
4	Loaded	HTTP 响应已经完全接收。

原文地址：https://www.jb51.cc/ajax/165567.html

简易解析ajax,javascript-XMLHttpRequest，解决乱码问题

相关推荐