1.AJAX简介
- 没有AJAX会怎么样?普通的ASP.Net每次执行服务端方法的时候都要刷新当前页面,比如实现显示服务器时间。每次都要刷新页面的坏处:页面刷新打断用户操作、速度慢、增加服务器的流量压力。如果没有AJAX,像在优酷网站看视频的过程中如果点击了评论等功能,页面就会刷新,视频就会被打断。
- AJAX(Asynchronous JavaScript and XML,异步JavaScript和XML)是一种进行页面局部异步刷新的技术,用AJAX向服务器发送请求和获得服务器返回的数据并且更新到界面中,不是整个页面刷新,而是在HTML页面中使用JavaScript创建XMLHTTPRequest对象来向服务器发出请求以及获得返回的数据,就像JavaScript版的WebClient一样,在页面中由XMLHTTPRequest来发出Http请求和获得服务器的返回数据,这样页面就不会刷新了。XMLHTTPRequest是AJAX的核心对象。
- 开发一个AJAX功能需要开发服务端和客户端两块程序。例如,我们开发一个显示服务端的时间为例:首先开发一个一般程序程序GetDate1.ashx,输出当前时间。在HTML页面中放一个按钮,在按钮的onclick中创建XMLHTTP向GetDate1.ashx发送请求,获得返回的数据并显示到界面上。如面试常考:不使用UpdatePanel,JQuery等AJAX库编写一个AJAX程序。
- 也可以在xmlhttp.open向服务器传递参数:xmlhttp.open("POST","GetDate1.ashx?id=1",false),如果传递给服务器的请求里有中文,则需要使用JavaScript函数encodeURI来进行URL编码。
- POST方式下一般不会有缓存,Get则有,如果页面地址不变的话,则会直接从缓存读取。
示例1:取得服务端时间
1. 开发服务端,建立一般处理程序
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web; namespace AJAX1
{
/// <summary>
/// AJAXGetTime 的摘要说明
/// </summary>
public class AJAXGetTime : IHttpHandler
{ public void ProcessRequest(HttpContext context)
{ context.Response.ContentType = "text/plain";
//以下的这些都是清除缓存用的,因为用get的方法时,如果有缓存,则回应是从缓存中读取的。
context.Response.Buffer = true;
context.Response.Expires = ;
context.Response.ExpiresAbsolute = DateTime.Now.AddDays(-);
context.Response.AddHeader("pragma", "no-cache");
context.Response.AddHeader("cache-control", "private");
context.Response.CacheControl = "no-cache";
string id = context.Request["id"]; context.Response.Write(DateTime.Now.ToString()+"-->"+id);
} public bool IsReusable
{
get
{
return false;
}
}
}
}
2.开发客户端,建立普通 的html页面,用JavaScript创建XMLHTTPRequest,此示例是IE的xmlhttp的,如果用到其它内核的浏览器则要创建其它浏览器的xmlhttprequest.
<!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>
<title></title>
<meta HTTP-EQUIV="pragma" CONTENT="no-cache" />
<meta HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate" />
<meta HTTP-EQUIV="expires" CONTENT="0" />
<script type="text/javascript">
function gettime() {
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");//创建xmlhttp对象,相当于创建webclient
if (!xmlhttp) {
alert("创建xmlhttp对象异常.");
return;
} xmlhttp.open("GET", "AJAXGetTime.ashx?id="+encodeURI("国家名称"), false); //准备向服务器AJAXGetTime.ashx发出post请求
//XMLHTTP默认(也推荐)不是同步请求的,也就是open方法并不像webclient的downloadString那样把服务器返回的数据拿到才返回,是异步的。因此需要监听onreadystatechange事件
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {//4表示数据已返回了
if (xmlhttp.status == 200) { //返回成功
document.getElementById("Text1").value = xmlhttp.responseText; //responseText属性为服务器返回的文本.
}
else {
alert("AJAX服务器返回错误."); //此时才开始发送请求
return;
} }
}
xmlhttp.send();
}
</script>
<style type="text/css">
#Text1 {
width: 449px;
}
</style>
</head>
<body> <p>
<input id="Text1" type="text" /><input id="Button1" type="button"
value="GetServerTime" onclick="gettime();" /></p> </body>
</html>
1.AJAX简介的更多相关文章
- PHP AJAX 简介
AJAX 简介 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX 是什么? AJAX = Asynchronous JavaScript and XML. AJAX ...
- {Django基础七之Ajax} 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解)
Django基础七之Ajax 本节目录 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解) 一 Ajax简介 ...
- js进阶课程ajax简介(ajax是浏览器来实现的)
js进阶课程ajax简介(ajax是浏览器来实现的) 一.总结 1.ajax使用需要服务器支持,比如phpstudy 2.ajax是浏览器支持的功能:ajax有个核心对象XMLHttpRequest, ...
- {Django基础七之Ajax} 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解)
{Django基础七之Ajax} 一 Ajax简介 二 Ajax使用 三 Ajax请求设置csrf_token 四 关于json 五 补充一个SweetAlert插件(了解) Django基础七之 ...
- ajax简介及JS写原生ajax
ajax 1.什么是ajax ajax 的全称是Asynchronous JavaScript and XML,其中, Asynchronous 是异步的意思,指的是异步 JavaScript 和 X ...
- AJAX简介
基本介绍 AJAX 指异步 JavaScript 及 XML(Asynchronous JavaScript And XML). 国内翻译常为“阿贾克斯”和阿贾克斯足球队同音.Web应用的交互如Fli ...
- AJAX 简介
什么是 AJAX ? AJAX = 异步 JavaScript 和 XML. AJAX 是一种用于创建快速动态网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味 ...
- AJAX开发技术--AJAX简介
Asynchronous JavaScript and XML,异步JavaScript和XML 主要目的用于页面的局部刷新.不用全部刷新,提高性能. 在AJAX中主要是通过XMLHttpReque ...
- jQuery AJAX 简介
AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新. jQuery AJAX 实例 使用 jQuery AJAX 修改文本内容 尝试一下 » 什么是 AJAX? A ...
随机推荐
- iOS 百度地图 小的特点demo
先上图的样子 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDEyMzIwOA==/font/5a6L5L2T/fontsize/400/fill ...
- Jboss image upload and http access to show image--reference
question I am uploading images to jboss server by getting the absolute path using the following code ...
- Java——(五)Collection之List集合、ArrayList和Vector实现类
------Java培训.Android培训.iOS培训..Net培训.期待与您交流! ------- 一.List集合 List集合代表一个元素有序.客重复的集合,集合中每个元素都有其对应的顺序索引 ...
- poj 3565 ants
/* poj 3565 递归分治 还有用KM的做法 这里写的分治 按紫书上的方法 不过那里说的有点冗杂了 可以简化一下 首先为啥可以分治 也就是分成子问题解决 只要有一个集合 黑白的个数相等 就一定能 ...
- 客户端session与服务端session
会话(Session)跟踪是Web程序中常用的技术,用来跟踪用户的整个会话.常用的会话跟踪技术是Cookie与Session.Cookie通过在客户端记录信息确定用户身份,Session通过在服务器端 ...
- PHP 开启报错机制
屏蔽PHP错误提示 方法一:在有可能出错的函数前加@,然后or die("") 如: @mysql_connect(...) or die("Database Conne ...
- 关于一些Android冷知识
1. 在Android4.0以后,EditText就由以前的输入框变成了一条划线的输入方式,如需要变为老版本的,只需在layout里面引入代码: android:background="@a ...
- C# - Sql数据类型的对应关系
<Language From="SQL" To="C#"> <Type From="bigint" To="lo ...
- linq学习笔记:将List<T> 转换为 Dictionary<T Key,T Value>
运用Linq,将List<T> 转换为 Dictionary<T Key,T Value> 即:List<T> ToDictionary<T Key,T V ...
- iOS sizeWithFont 过期 is deprecated
原文: http://www.cnblogs.com/A--G/p/4819189.html iOS 2.0之后 sizeWithFont就被弃用了: //计算textview 高度 - (float ...