一个简单的客户端调用xmlHttp的ajax例子

最新推荐文章于 2021-08-05 18:50:41 发布

Mobidogs

最新推荐文章于 2021-08-05 18:50:41 发布

阅读量1.4k

点赞数

分类专栏： js/html/css技巧 AJAX/jQuery 文章标签： ajax xmlhttprequest function callback url null

本文链接：https://blog.csdn.net/Mobidogs/article/details/1750385

版权

js/html/css技巧同时被 2 个专栏收录

20 篇文章 0 订阅

订阅专栏

AJAX/jQuery

11 篇文章 0 订阅

订阅专栏

一个简单的客户端调用xmlHttp的例子。

客户端调用xmlHttp的过程很简单，只有5个步骤：
1、创建xmlHttp对象
2、打开与服务端的连接，同时定义指令发送方式，服务网页(URL)和请求权限等。
客户端通过Open命令打开与服务端的服务网页的连接。与普通Http指令传送一样，可以用"GET"方法或"POST"方法指向服务端的服务网页。
3、发送指令。
4、等待并接收服务端返回的处理结果。
5、释放xmlHttp对象

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>xmlHttp test</title>
<script type="text/javascript" language="javascript">
function jb() {
  var A=null;
  try {
    A=new ActiveXObject("Msxml2.XMLHTTP");
  }
  catch(e) {
    try {
      A=new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch(oc) {
      A=null;
    }
  }

  if ( !A && typeof XMLHttpRequest != "undefined" ) {
    A=new XMLHttpRequest();
  }
  return A;
}

var req = null;

function doRequest() {
  req = null;
  //创建xmlHttp对象
  req = jb();

  //如果浏览器不支持，提示错误信息。
  if (!req) {
    alert("Giving up. Cannot create an XMLHttp instance.");
    return false;
  }

  //定义用来处理接收数据的回调函数
  req.onreadystatechange = callback;

  /******* 这部分是以post方式提交的用法 ******/
  //提交参数内容
  var strData = "code=123";
  //数据提交的目标位置
  var url = "default.asp";
  //以post方法，将参数code=123提交给default.jsp去处理
  req.open("POST", url, true);
  req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

  //req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8"); //用utf-8编码

  req.send(strData);
  /*******************************************/

  /******* 这部分是以get方式提交的用法 ******
  //提交参数内容
  var strData = "code=123";
  //数据提交的目标位置，并将参数以get方式添加到url后面
  var url = "default.asp?" + strData;
  //以get方法，请求url：default.asp?code=123
  req.open("GET", url, true);
  req.send(null);
  /*******************************************/
}

function callback() {
  /* readyState属性能够反映出服务器在处理请求时的进展状况。
  0 = uninitialized
  1 = loading
  2 = loaded
  3 = interactive
  4 = complete
  */
  if (req.readyState == 4) {
    /* HTTP status code (i.e., 200, 404, 500, etc.)
    完整的状态值可参考w3c的列表：http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html
    我们只关心值为200的OK相应
    */
    if (req.status == 200) {
      showResponse();
    } else {
      alert("There was a problem with the request.");
    }
  }
}
function showResponse(){
  /* 几种返回值的接收方法：
  responseBody：结果返回为无符号整数数组。
  responseStream：结果返回为IStream流。
  responseText ：结果返回为字符串。
  responseXML：结果返回为XML格式数据。
  */
  alert(req.responseText);
}
</script>
</head>
<body>
<input type="button" name="Button" value="发出请求" οnclick="doRequest()" />
</body>
</html>

//default.asp 此略

//在服务器端 Post来的用Request.Form("code") 接收

Get来的用Request.QueryString("code")

Mobidogs

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
一个简单的客户端调用xmlHttp的ajax例子

一个简单的客户端调用xmlHttp的例子。客户端调用xmlHttp的过程很简单，只有5个步骤： 1、创建xmlHttp对象 2、打开与服务端的连接，同时定义指令发送方式，服务网页(URL)和请求权限等。客户端通过Open命令打开与服务端的服务网页的连接。与普通Http指令传送一样，可以用"GET"方法或"POST"方法指向服务端的服务网页。 3、发送指令。 4、等待并接收服务端返回的处理结果。
复制链接

扫一扫

专栏目录