博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AJAX学习1
阅读量:7191 次
发布时间:2019-06-29

本文共 1936 字,大约阅读时间需要 6 分钟。

看了5.3节的AJAX.NET进行开发,让我对AJAX有了新的认识,之前只是知道它可以实现无刷新的技术吧,现在知道其机制了。下面应该是AJAS原始开发的原理吧:

对于AJAS技术的基础和核心,XMLHttpRequest对象应该是其实现发送异步请求并响应执行回调。

XMLHttpRequest有几个属性如readyState属性的五个状态,Open()方法,send()方法都很重要。这边我就不都记录下来了。以后再看的时候自己再去翻书。

1、在配置好的站点工程里面新建一个名为AjaxTest.aspx页面。首先在cs文件中的page_load事件函数中写下如下代码:

1
protected
void
Page_Load(
object
sender, EventArgs e)
2
{
3
if
(Request.QueryString[
"
s
"
]
==
"
1
"
)
//
使用Request.QueryString 来指示这个请求是通过Ajax发出的
4
 
{
5
Response.Write(
"
hello world!
"
);
//
向HttpResponse中输出hello world!
6
 
Response.End();
//
将页面缓冲发送向客户端浏览器 并中止该页输出 如果去掉这句 会得到多余的HTML代码
7
}
8
}

2、前台代码:

<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
runat
="server"
>
<
title
>
XMLHttpRequest测试
</
title
>
<
script
language
="javascript"
type
="text/javascript"
>
<!--
function
GetInfo(){
//
我们就是通过这个函数来异步获取信息的
 
var
xmlHttpReq
=
null
;
//
申明一个空对象用来装入XMLHttpRequest
if
(window.XMLHttpRequest){
//
除IE5 IE6 以外的浏览器XMLHttpRequest是作为window的一个子对象
  xmlHttpReq
=
new
XMLHttpRequest();
//
我们通常采用这种方式实例化一个XMLHttpRequest
}
else
if
(window.ActiveXObject){
//
IE5 IE6是以ActiveXObject的方式引入XMLHttpRequest的
xmlHttpReq
=
new
ActiveXObject(
"
Microsoft.XMLHTTP
"
);
//
IE5 IE6是通过这种方式
}
if
(xmlHttpReq
!=
null
){
//
如果对象实例化成功
xmlHttpReq.open(
"
get
"
,
"
XMLHttpRequest.aspx?s=1
"
,
true
);
//
调用open()方法 并采用异步方式
xmlHttpReq.onreadystatechange
=
RequestCallBack;
//
设置回调函数
xmlHttpReq.send(
null
);
//
因为使用get方式提交 所以可以使用null参调用
}
function
RequestCallBack(){
//
一旦readyState值改变 将会调用这个函数
if
(xmlHttpReq.readyState
==
4
)
{
document.getElementById(
"
iptText
"
).value
=
xmlHttpReq.responseText;
//
将xmlHttpReq.responseText的值付给iptText控件
}
}
}
-->
</
script
>
</
head
>
<
body
>
<
form
id
="form1"
runat
="server"
>
<
div
>
<
input
id
="iptText"
type
="text"
value
=""
/>
<
input
type
="button"
id
=""
value
="Ajax提交"
onclick
="GetInfo();"
/>
<!--
点击这个按钮调用
-->
</
div
>
</
form
>
</
body
>
</
html
>

转载于:https://www.cnblogs.com/huaizuo/archive/2011/07/04/2097434.html

你可能感兴趣的文章
单行文本溢出省略号,多行文本?
查看>>
ZooKeeper 典型的应用场景——及编程实现
查看>>
在spring中实现quartz2.2.1的动态调度(开始、暂停、停止等)
查看>>
Z-BlogPHP 安装出现 (8) Undefined offset: 6 解决方法
查看>>
利用python代码获取文件特定的内容,并保存为文档
查看>>
删除列表的重复元素
查看>>
iOS 数据库持久化
查看>>
SAP数据更新的触发
查看>>
全国绿色计算大赛 模拟赛第二阶段 (Python)
查看>>
算法笔记--Splay && Link-Cut-Tree
查看>>
android学习1-----项目红叉报错 gen下缺少R.java
查看>>
验证码的破解
查看>>
采药(动态规划背包问题总结)
查看>>
exec与xargs区别
查看>>
Linux 实现服务器之间时间同步
查看>>
python时间模块time详解
查看>>
jquery的outerHeight,outerWidth方法
查看>>
YII2表单中上传单个文件
查看>>
node.js中 express + multer 处理文件上传
查看>>
new 到底发生了什么
查看>>