//第一步,创建XMLHttpRequest对象
var xmlHttp = new XMLHttpRequest();
function CommentAll() {
//第二步,注册回调函数
xmlHttp.onreadystatechange =callback1;
//{
// if (xmlHttp.readyState == 4)
// if (xmlHttp.status == 200) {
// var responseText = xmlHttp.responseText; // }
//}
//第三步,配置请求信息,open(),get
//get请求下参数加在url后,.ashx?methodName = GetAllComment&str1=str1&str2=str2
xmlHttp.open("post", "/ashx/myzhuye/Detail.ashx?methodName=GetAllComment", true); //post请求下需要配置请求头信息
//xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //第四步,发送请求,post请求下,要传递的参数放这
xmlHttp.send("methodName = GetAllComment&str1=str1&str2=str2");//" }
//第五步,创建回调函数
function callback1() {
if (xmlHttp.readyState == )
if (xmlHttp.status == ) {
//取得返回的数据
var data = xmlHttp.responseText;
//json字符串转为json格式
data = eval(data);
$.each(data,
function(i, v) {
alert(v);
});
}
} //后台方法
private void GetAllComment(HttpContext context)
{ //Params可以取得get与post方式传递过来的值。
string methodName = context.Request.Params["methodName"]; //QueryString只能取得get方式传递过来的值。
string str1 = context.Request.Form["str1"]; //取得httpRequest传来的值,包括get与post方式
string str2 = context.Request["str2"]; List<string> comments = new List<string>(); comments.Add(methodName); comments.Add(str1); comments.Add(str2); //ajax接受的是json类型,需要把返回的数据转给json格式
string commentsJson = new JavaScriptSerializer().Serialize(comments);
context.Response.Write(commentsJson);
}

上面是代码,那简单总结下如下,要完整实现一个AJAX异步调用和局部刷新,通常需要以下几个步骤:

(1)创建XMLHttpRequest对象,也就是创建一个异步调用对象.

(2)创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息.

(3)设置响应HTTP请求状态变化的函数.

(4)发送HTTP请求.

(5)获取异步调用返回的数据.

(6)使用JavaScript和DOM实现局部刷新.

原生ajax请求的五个步骤的更多相关文章

  1. ajax请求的五个步骤

    创建XMLHttpRequest异步对象 var xhr = new XMLHttpRequest() 设置回调函数 xhr.onreadystatechange = callback 使用open方 ...

  2. 原生AJAX请求教程

    ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...

  3. Servlet处理原生Ajax请求

    萌新小白人生中的第一篇博客,难免会有差错,还望各位大佬多多包涵. 1. Ajax技术简介      Ajax(Asynchronous JavaScript and XML,异步JavaScript和 ...

  4. 原生 ajax 请求

    ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...

  5. 前后端数据交互(二)——原生 ajax 请求详解

    一.ajax介绍 ajax 是前后端交互的重要手段或桥梁.它不是一个技术,是一组技术的组合. ajax :a:异步:j:js:a:和:x:服务端的数据. ajax的组成: 异步的 js 事件 其他 j ...

  6. js原生ajax请求get post笔记

    开拓新领域,贵在记录.下面记录了使用ajax请求的get.post示例代码 //ajax get 请求获取数据支持同步异步 var ajaxGet = function (reqUrl, params ...

  7. JavaScript原生Ajax请求纯文本数据

    源代码 ajax1.html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...

  8. php下的原生ajax请求

    浏览器中为我们提供了一个JS对象XMLHttpRequet,它可以帮助我们发送HTTP请求,并接受服务端的响应. 意味着我们的浏览器不提交,通过JS就可以请求服务器.   ajax(Asynchron ...

  9. AJAX应用的五个步骤

    1.建立xmlHttpRequest对象 if(window.XMLHttpRequest) {    xmlHttp = new XMLHttpRequest();    if(xmlHttp.ov ...

随机推荐

  1. Linux 开机引导和启动过程详解

    你是否曾经对操作系统为何能够执行应用程序而感到疑惑?那么本文将为你揭开操作系统引导与启动的面纱. 理解操作系统开机引导和启动过程对于配置操作系统和解决相关启动问题是至关重要的.该文章陈述了 GRUB2 ...

  2. HBase之四--(2):spring hadoop 访问hbase

    1.  环境准备: Maven Eclipse Java Spring 2. Maven  pom.xml配置 <dependency> <groupId>org.apache ...

  3. E20180403-hm

    accompany vt. 陪伴,陪同; 附加,补充; 与…共存; 为…伴奏 synchronous adj. 同时存在[发生]的,同步的 asynchronous adj. 异步的; particu ...

  4. (水题)洛谷 - P1603 - 斯诺登的密码

    https://www.luogu.org/problemnew/show/P1603 有毒,大小写不检测,句号也不管. #include<bits/stdc++.h> using nam ...

  5. Swift3.0 元组 (tuples)

    //元组 //不需要的元素用 _ 标记 let (name,age,_) = (","男") print(name,age) //通过下标访问特定的元素 let stud ...

  6. hdoj1272 小希的迷宫

    并查集 = =.一开始判断连通,没有判断环,后来判断了环,没有判断连通... 还有就是一开始是0 0,也是Yes,有道理么?我不是很懂.. #include <iostream> #inc ...

  7. PJzhang:计算机本地密码提取工具LaZagne

    猫宁!!! 参考链接: https://www.4hou.com/tools/7404.html https://www.secpulse.com/archives/32189.html 在一个信息收 ...

  8. kibana 操作

    插入时不指明id,不会自动生成id,和视频中的不一样啊 解决: 其实是可以的,不过put不可以 POST才可以 中文输入有问题: 待解决: 基本操作记录 GET _search { "que ...

  9. 跟我一起玩Win32开发(15):ListView控件

    这个控件其实不用阿拉来介绍,因为它太常见了,就好像我们一出门就会看到妹子一样常见.当然也可以说,它是对ListBox的扩充. 在使用该控件之前,我先介绍VS的一个相当好玩的功能. 在代码文件的#inc ...

  10. memcache操作

    1 格式(telnet) <command name> <key> <flags> <exptime> <bytes> a) <com ...