Ajax入门收藏(转)
2009-05-22 14:08
204 查看
大体的过程是这样的.
①先创建一个XMLHttpRequest对象.
②确定该对象的状态改变时要调用的javascript脚本. 说白了就是你通过该对象与后台进行通信完成后要执行什么操作.即:收到服务器的响应后,需要做什么。
③向后台发送请求. 发送后获得的接受结果(如果有接收结果)在②中调用的脚本中操作.
【源码】
/*页面部分,在页面中添加以下脚本*/
<script language="javascript" type="text/javascript">
<!--
var xmlHttp; //声明XMLHttpRequest对象
//创建XMLHttpRequest对象
function createXMLHttpRequest()
{
if(window.ActiveXObject) //如果是IE浏览器
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest) //非IE浏览器
{
xmlHttp=new XMLHttpRequest();
}
else
{
return;
}
} //主要过程
function startRequest()
{
creatXMLHttpRequest(); //①
xmlHttp.onreadystatechange=handleStateChange; //②
xmlHttp.open("GET",AX.aspx?flag="AX"&email="AXzhz@163.com",true); //③ 参数1:提交方式为GET,
xmlHttp.send(); //参数2:提交的页面及附带的参数 参数3:异步通信
}
//要调用的脚本,即收到服务器的响应后,需要做什么。
function handleStateChange()
{
if(xmlHttp.readyState==4)//响应完成
{
if(xmlHttp.status==200)//响应正常/OK
{
/*正常响应后,你要做什么操作都写到这里*/
var result = xmlHttp.responseText; //取得后台的返回值
alert("Ajax操作完成,从后台返回的值为"+result);
}
else
{
alert("很抱歉!\n"+xmlHttp.statusText+xmlHttp.status);
}
}
else
{
alert("很抱歉!Ajax没有完成响应!!");
}
}
//-->
<script> /*提交到的AX.aspx网页后台部分*/
首先:把AX.aspx的页面部分(HTML代码)删干净,只剩第一行代码,再对后台代码部分进行操作
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace AXzhang
{
/// <summary>
/// initializeSearch 的摘要说明。
/// </summary>
public class initialize: System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
//获取Ajax传过来的参数,这里我只获取了其中的一个参数.
string result=Request.QueryString["flag"].ToString();
result+=":from AX.aspx";
//把result返回给页面
Response.Write(result);
} #region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
①先创建一个XMLHttpRequest对象.
②确定该对象的状态改变时要调用的javascript脚本. 说白了就是你通过该对象与后台进行通信完成后要执行什么操作.即:收到服务器的响应后,需要做什么。
③向后台发送请求. 发送后获得的接受结果(如果有接收结果)在②中调用的脚本中操作.
【源码】
/*页面部分,在页面中添加以下脚本*/
<script language="javascript" type="text/javascript">
<!--
var xmlHttp; //声明XMLHttpRequest对象
//创建XMLHttpRequest对象
function createXMLHttpRequest()
{
if(window.ActiveXObject) //如果是IE浏览器
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest) //非IE浏览器
{
xmlHttp=new XMLHttpRequest();
}
else
{
return;
}
} //主要过程
function startRequest()
{
creatXMLHttpRequest(); //①
xmlHttp.onreadystatechange=handleStateChange; //②
xmlHttp.open("GET",AX.aspx?flag="AX"&email="AXzhz@163.com",true); //③ 参数1:提交方式为GET,
xmlHttp.send(); //参数2:提交的页面及附带的参数 参数3:异步通信
}
//要调用的脚本,即收到服务器的响应后,需要做什么。
function handleStateChange()
{
if(xmlHttp.readyState==4)//响应完成
{
if(xmlHttp.status==200)//响应正常/OK
{
/*正常响应后,你要做什么操作都写到这里*/
var result = xmlHttp.responseText; //取得后台的返回值
alert("Ajax操作完成,从后台返回的值为"+result);
}
else
{
alert("很抱歉!\n"+xmlHttp.statusText+xmlHttp.status);
}
}
else
{
alert("很抱歉!Ajax没有完成响应!!");
}
}
//-->
<script> /*提交到的AX.aspx网页后台部分*/
首先:把AX.aspx的页面部分(HTML代码)删干净,只剩第一行代码,再对后台代码部分进行操作
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace AXzhang
{
/// <summary>
/// initializeSearch 的摘要说明。
/// </summary>
public class initialize: System.Web.UI.Page
{
private void Page_Load(object sender, System.EventArgs e)
{
//获取Ajax传过来的参数,这里我只获取了其中的一个参数.
string result=Request.QueryString["flag"].ToString();
result+=":from AX.aspx";
//把result返回给页面
Response.Write(result);
} #region Web 窗体设计器生成的代码
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 该调用是 ASP.NET Web 窗体设计器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void InitializeComponent()
{
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
}
}
相关文章推荐
- AJAX技术简介及入门实例[收藏]
- ajax入门到精通(网络收藏)
- Ajax入门Javascript--动态生成文本输入框
- Ajax PHP简单入门教程代码
- EXT入门(三)---ajax
- 深入浅出AJAX (一) 轻松入门
- ajax(ajax开发与入门)
- ajax 入门案例
- Ajax快速入门
- ASP.NET MVC 入门10 使用AJAX
- AJAXJS MVC 入门
- 白话 Ajax 及其入门基础(2)
- AjaxPro快速入门
- AJAX入门之深入理解JavaScript中的函数
- AJAX下载地址《收藏》
- 掌握 Ajax,第 1 部分: Ajax 入门简介 理解 Ajax 及其工作原理,构建网站的一种有效方法
- jQuery中文入门指南,翻译加实例,jQuery的起点教程(一) 收藏
- Shell脚本编程学习入门 02 分类: arm-linux-Ubuntu 2013-08-30 17:45 427人阅读 评论(0) 收藏
- AJAX入门知识(1)