原生ajax请求的五个步骤
//第一步,创建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请求的五个步骤的更多相关文章
- ajax请求的五个步骤
创建XMLHttpRequest异步对象 var xhr = new XMLHttpRequest() 设置回调函数 xhr.onreadystatechange = callback 使用open方 ...
- 原生AJAX请求教程
ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...
- Servlet处理原生Ajax请求
萌新小白人生中的第一篇博客,难免会有差错,还望各位大佬多多包涵. 1. Ajax技术简介 Ajax(Asynchronous JavaScript and XML,异步JavaScript和 ...
- 原生 ajax 请求
ajax 即 Asynchronous Javascript And XML,AJAX 不是一门的新的语言,而是对现有持术的综合利用.本质是在 HTTP 协议的基础上以异步的方式与服务器进行通信. 异 ...
- 前后端数据交互(二)——原生 ajax 请求详解
一.ajax介绍 ajax 是前后端交互的重要手段或桥梁.它不是一个技术,是一组技术的组合. ajax :a:异步:j:js:a:和:x:服务端的数据. ajax的组成: 异步的 js 事件 其他 j ...
- js原生ajax请求get post笔记
开拓新领域,贵在记录.下面记录了使用ajax请求的get.post示例代码 //ajax get 请求获取数据支持同步异步 var ajaxGet = function (reqUrl, params ...
- JavaScript原生Ajax请求纯文本数据
源代码 ajax1.html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...
- php下的原生ajax请求
浏览器中为我们提供了一个JS对象XMLHttpRequet,它可以帮助我们发送HTTP请求,并接受服务端的响应. 意味着我们的浏览器不提交,通过JS就可以请求服务器. ajax(Asynchron ...
- AJAX应用的五个步骤
1.建立xmlHttpRequest对象 if(window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); if(xmlHttp.ov ...
随机推荐
- C++实现合并两个已经排序的链表
/* * 合并两个已经排序的链表.cpp * * Created on: 2018年4月11日 * Author: soyo */ #include<iostream> using nam ...
- ORA-01843: not a valid month 错误
转自:https://blog.csdn.net/jetluning/article/details/48785599 insert into ......的场合发生ORA-01843: not a ...
- word-break: break-all word-break:keep-all word-wrap: break-word三者的区别
word-break属性:指定非CJK脚本的断行规则. 值 描述 normal 使用浏览器默认的换行规则. break-all 允许在单词内换行. keep-all 只能在半角空格或连字符处换行. w ...
- 019--python内置函数
一.内置高阶函数 map函数:接收两个数据 函数和序列,map()将函数调用'映射'到序列身上,并返回一个含有所有返回值的一个列表 num1 = [1,2,3,4,5] num2 = [5,4,3,2 ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 07. View的Model 和 Tag Helpers
student添加一个属性BirthDate 然后把生成数据的地方,字段也加上 建立ViewModel list转换为ViewModel 进一步改进代码 StudentViewModel HomeIn ...
- linux C之access函数(转载)
转自:http://blog.sina.com.cn/s/blog_6a1837e90100uh5d.html access():判断是否具有存取文件的权限 相关函数 stat,open,chm ...
- 在Emacs中使用ECB(转载)
转自:http://joerong666.iteye.com/blog/1813876 By: 潘云登 Date: 2009-7-9 Email: ...
- 算法学习--Day3
今天搞了一波算法的哈希,代码难道不大,记录在这里吧. 题目描述 “臭味相投”——这是我们描述朋友时喜欢用的词汇.两个人是朋友通常意味着他们存在着许多共同的兴趣.然而作为一个宅男,你发现自己与他 ...
- HDU 4542 小明系列故事——未知剩余系 (数论|反素数)
分析 kuangbin的blog已经讲的很好了,我做一点补充 1.当做x*y>z的比较时,如果x \(\ast\) y过大,可以写成x>z/y 2.分解质因数时选择用f[][0]保存质数, ...
- 51nod1432【贪心】
对于每个数我找一个和他相加最接近独木舟,然后ans+=1; 想复杂了,直接两端来就好了. 然后两个相加如果<=m那么就让它们在一起,不是的话就让大的一艘船,然后继续搞(贪心) #include ...