如何实现对象克隆使用XMLHTTPRequest对象实现无刷新效果

&script type="text/javascript"&
window.onload = function () {
document.getElementById("btn").onclick = function () {
var username = document.getElementById("uname").
var password = document.getElementById("pwd").
var xmh = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xmh.open("post", "/Handler1.ashx?username=" + username + "&password=" + password, true);
xmh.onreadystatechange = function () {
if (xmh.readyState == 4) {
if (xmh.status == 200) {
//var x=eval('('+xmh.responseText+')');//把json字符串转换为json对象
//上下两种方法都行
var x = JSON.parse(xmh.responseText);//把json字符串转换为json对象
alert(x.status);
alert("出错");
xmh.send();
什么是 XMLHttpRequest 对象?
XMLHttpRequest 对象用于在后台与服务器交换数据。
XMLHttpRequest 对象是开发者的梦想,因为您能够:
在不重新加载页面的情况下更新网页
在页面已加载后从服务器请求数据
在页面已加载后从服务器接收数据
在后台向服务器发送数据
所有现代的浏览器都支持 XMLHttpRequest 对象。
&在回调函数中处理服务器的响应
onreadystatechange就是回调函数(处理服务器的响应,根据状态码)
0:请求未初始化(还没有调用&open())。
1:请求已经建立,但是还没有发送(还没有调用&send())。
2:请求已发送,正在处理中(通常现在可以从响应中获取内容头)。
3:请求在处理中;通常响应中已有部分数据可用了,但是服务器还没有完成响应的生成。
4:响应已完成;您可以获取并使用服务器的响应了。
status这类状态代码表明服务器成功地接受了客户端请求(如果readystatus为4,这只是服务器端完成了响应,但是是否是正确的响应就不知道了)200 - OK 一切正常,对GET和POST请求的应答文档跟在后面。&
阅读(...) 评论()订阅我的博客
用户名:chinamummy29
文章数:12
访问量:5353
无忧币:187
注册日期:
1、一个".java"源文件中是否可以包括多个类(不是内部类)?有什么限制?可以有多个类,但只能有一个public 的类,并且public 的类名必须与文件名相一致。2、说说&和&&的区别。&和&&都可以用作逻辑与的运算符,表示逻辑与(and),当运算符两边的表达式的结果都为true 时,整个运算结果才为true,否则,只要有一方为false,则结果为false。&&还具有短路的功能,即如果第一个表达式为false,则不再计算第二个表达式,例如,对于if(str != null && !str.equals(“”))表达式,当str 为null 时,..
struts2中BaseAction的模板package com.wucheng.import java.util.Mimport javax.servlet.ServletCimport javax.servlet.http.HttpServletRimport javax.servlet.http.HttpServletRimport org.apache.struts2.interceptor.ServletRequestAimport org.apache.struts2.interceptor.ServletResponseAimport org.apache.struts2.interceptor.SessionAimport org.apache.struts2.util.ServletContextApublic class BaseAction implements SessionAware,ServletRequestAware,..
Ajax使用浏览器内置的一个对象(XmlHttpRequest)向服务器发送请求,服务器返回xml数据或者是文本数据给浏览器,然后在浏览器端,使用这些数据更新部分页面,整个过程,页面无蔚乃⑿隆Ajax引擎(即XmlHttpRequest对象),首先为该对象注册一个监听器(该监听器是一个事件处理函数,对状态改变事件(readyStatechange)行监听)Ajax技术特点1) 页面无刷新2) 不打断用户的操作,用户的体验好。3) 按需获取数据,浏览器与服务器之间数据的传输量减少。4) 是一个标准技术,不需要下载任何的I件。5) 可以利用客户端(浏览器)的计算能力..
1.配置 struts.xml2.配置 web.xml3.导入相关的jar包事故一:
若web.xml没有配置,浏览器将会报 Error404,但不提示错在哪儿。
这是一个数据分页的JSP。从数据库中取得数据,再每页显示5行数据,共n页。&%@ page language="java" import="java.util.*" pageEncoding="utf-8"%&&%@taglib uri="/struts-tags" prefix="s"%&&html&
&title&projectList.jsp&/title&
&h1&Project List&/h1&
&h2&OGNL表达式重写projectlist.jsp&/h2&
&s:if test="page & 1"&
使用 synchronized 保证Servlet的同步。public class HelloServlet extends HttpServlet {
int i = 0;
int ticket = 2;
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
PrintWriter out = response.getWriter();
//out.println("jump to others " + "i = " + i);
//模拟卖票
&&页数 ( 1/2 )Ajax实现原理_百度文库
两大类热门资源免费畅读
续费一年阅读会员,立省24元!
Ajax实现原理
&&java培训,javaee培训,java培训学校,java培训机构,java工程师培训,java开发,java编程
阅读已结束,下载文档到电脑
想免费下载本文?
定制HR最喜欢的简历
你可能喜欢1935人阅读
/**//// &summary&
/// 生成带CDATA的节点
/// &/summary&
/// &param name="xDocument"&XmlDocument&/param&
/// &param name="elementName"&元素名称&/param&
/// &param name="cdataValue"&CDATA值&/param&
/// &returns&XmlElement&/returns&
public static XmlElement CreateXmlNodeCDATA(XmlDocument xDocument, string elementName, string cdataValue)
XmlElement xElement = xDocument.CreateElement(elementName);
XmlCDataSection cdata = xDocument.CreateCDataSection(cdataValue);
xElement.AppendChild(cdata);
return xE//返回
catch (Exception ex)
Helper#region Helper
/**//// &summary&
/// 创建Ajax返回信息
/// &/summary&
/// &param name="result"&&/param&
private void CreateResponse(string result)
XmlDocument xDocument = new XmlDocument();
XmlDeclaration declare = xDocument.CreateXmlDeclaration("1.0", "UTF-8", "yes");
XmlElement root = xDocument.CreateElement("root");
XmlElement eleResponse = CreateXmlNodeCDATA(xDocument, "response", result);
root.AppendChild(eleResponse);
xDocument.AppendChild(declare);
xDocument.AppendChild(root);
ResponseXML(xDocument);
System.Web.HttpContext.Current.Response.End();
/**//// &summary&
/// 向页面输出xml内容
/// &/summary&
/// &param name="xmlnode"&xml内容&/param&
private void ResponseXML(XmlDocument xmlNode)
System.Web.HttpContext.Current.Response.Expires = 0;
System.Web.HttpContext.Current.Response.Clear();
System.Web.HttpContext.Current.Response.Cache.SetNoStore();
System.Web.HttpContext.Current.Response.ContentType = "text/xml";
System.Web.HttpContext.Current.Response.Write(xmlNode.OuterXml);
System.Web.HttpContext.Current.Response.End();
} 关于Ajax的话题网上已经很多很多了,但好多都是利用控件开源框架来实现,特别是vs2008更是集成了好多ajax控件,把ajax的执行过程封装的严严实实。本人也用过这些框架和控件,感觉就是爽。但是近来心血来潮,想看看ajax到底是如何执行的,就想自己动手实现一下,正好也锻炼一下我的js水平。废话少说,如题,我们看一下执行过程。
1.这次实现总共用了两个页面:AjaxTest6.aspx和Ajax.aspx
  其中AjaxTest6.aspx是发起请求的页面,Ajax.aspx获取AjaxTest6.aspx的请求,并进行处理的页面。
  处理过程:(1)AjaxTest6.aspx发起http请求---&(2)Ajax.aspx获取url中的参数,根据此参数在数据库中执行查询操作并返回结果(数据集) ---&(3)把返回的数据集进行xml处理通过response输出。注意现在输出数据的格式是xml ---(4)AjaxTest6.aspx获得Ajax.aspx输出xml数据并显示
2.AjaxTest6.aspx中的js代码 &mce:script language="javascript" type="text/javascript"&&!--
function createXMLHttpRequest() //为xmlhttp创建实例
if(window.ActiveXObject)
xmlhttp=new ActiveXObject('Microsoft.XMLHttp');
else if(window.XMLHttpRequest)
xmlhttp=new XMLHttpRequest();
function stateRequest(vr1)//状态请求
//alert('看来已经执行了stateRequest了');
createXMLHttpRequest();//引用xmlhttp实例
xmlhttp.onreadystatechange=handleStateC//在请求状态发生改变时调用此方法
xmlhttp.open("GET","Tools/Ajax.aspx?cateid="+vr1,true);
xmlhttp.send(null);
function handleStateChange()
//alert("看来已经执行了handleStateChange()了");
var divRet=document.getElementById("ret");
if(xmlhttp.readyState == 4)
if(xmlhttp.status == 200)
var text= GetText();
divRet.innerHTML=
divRet.innerHTML="&img src="/" mce_src="/""images/loading.gif/" alt=/"数据加载中/" /&&b&数据加载中&/b&";
function GetText()
var xmlDoc=xmlhttp.responseXML;
//alert(xmlDoc.toString());
if(xmlDoc == null)
//alert("执行到这里了吗");
return "暂无数据!";
var requestNode=xmlDoc.getElementsByTagName("response")[0];
var node=requestNode.firstChild.nodeV
//alert(node);
return node
// --&&/mce:script&
&说明:第一个函数createXMLHttpRequest用来创建XMLHttpRequest对象,关于该对象的详细 说明可以参考相关文章,现在只要明白当我们使用http请求发送数据,并使用xml来传递数据时要用到该对象,声明好后我们就可以在下面使用了
第二个函数是 用来发送http请求,一般情况下url都带有参数,通过 xmlhttp.open("GET","Tools/Ajax.aspx?cateid="+vr1,true);这句话我们可以看出来是向Ajax.aspx发送带参数的请求,Ajax.aspx捕获此参数,然后根据此参数在数据库中执行查询,具体处理过程我们下面细说。
&&&& 在这个函数中我们还要注意一句话xmlhttp.onreadystatechange=handleStateC//在请求状态发生改变时调用此方法
因为xmlhttp对象在执行的过程中要分为几个阶段,每个阶段都对应不同的状态值:0 表示初始化,1表示正在加载,,2表示已加载,3表示交互中,4表示完成
所以上面那段代码表示只要xmlhttp的对象的状态发生变化就执行 handleStateChange方法,它具体实现的功能如下:
&这个方法首先找到显示数据的个div标签(ret),然后判断xmlhttp的执行状态,当状态值变成4并且xmlhttp.status==200 (status是服务器的http状态码 200对应OK 404对应Not Found,如果你对xmlhttprequest对象不是很熟,建议你先熟悉一下)
&&&& 显然当xmlhttp.onready==4并且xmlhttp.stauts==200说明已经在服务器端把所有的数据读出来了,此时数据放在一个xml文件中,这个xml文件是我们在服务器端生成的。
&&&& 程序执行到现在已经万事俱备了,现在只欠从浏览器中读取这个xml文件了。这时要注意,也就是下面我们要说的最后一个函数GetText()
&这个函数首先告诉浏览器我们要读取是个xml对象(当然你也可以设置成字符串格式的,例如:var xmlDoc=xmlhttp.responseText);我们之所以把数据集设置成xml格式是因为此时它可以被解析为一个DOM对象,这样我们在下面对它的处理就相当灵活了。
& & 到现在我们已经把客户端的代码说完了,下面说一下服务器端的执行过程,这个过程是在Ajax.aspx的后置代码中完成的
1.首先我们在Page_Load事件中获取url中的参数,该参数从AjaxTest6.aspx中发送。然后根据此参数执行查询,具体代码我就不再详细解释,大家一看就明白,代码如下:
private static readonly string sql = "server=database=uid=pwd=xxx";
protected void Page_Load(object sender, EventArgs e)
string id=Request.QueryString["cateid"];
System.Threading.Thread.Sleep(2000);
GetTitle(Convert.ToInt32(id));
private DataTable GetLogs(int cateid)
using (SqlConnection con = new SqlConnection(sql))
con.Open();
string select = "SELECT Id,CateId,LogTitle FROM Logs WHERE CateId = " +
SqlDataAdapter sda = new SqlDataAdapter(select, con);
DataTable dt = new DataTable();
sda.Fill(dt);
con.Close();
public void GetTitle(int id)
DataTable dt = GetLogs(id);
StringBuilder sb = new StringBuilder();
if (dt != null && dt.Rows.Count&0)
for (int i = 0; i & dt.Rows.Ci++ )
sb.AppendLine(dt.Rows[i][2].ToString());
CreateResponse(sb.ToString());
说明:通过GetTitle(int id)可以看出,我把从库里读出的数据转换成字符串交给CreateResponse方法(这里可能不太合适,因为当数据量大时可能不太安全),下面就是关于把数据转化成xml文件的操作
&&相关文章推荐
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
访问:248006次
积分:2995
积分:2995
排名:第13880名
原创:30篇
转载:56篇
评论:55条
(1)(2)(1)(1)(1)(2)(1)(1)(2)(1)(1)(2)(1)(1)(1)(2)(1)(1)(1)(1)(1)(4)(2)(4)(2)(1)(2)(2)(1)(1)(1)(1)(3)(8)(4)(1)(3)(2)(2)(3)(1)(2)(2)(1)(1)(2)(2)(2)
(window.slotbydup = window.slotbydup || []).push({
id: '4740881',
container: s,
size: '200,200',
display: 'inlay-fix'AJAX 文件上传
视频太卡?试试切换线路
本课时介绍常用的异步文件上传方案。
本课时介绍利用隐藏的 iframe 实现异步文件上传的方法。
本课时介绍利用 XMLHttpRequest level 2 新增的上传功能及相关 API 实现文件上传的方法。
只有成为VIP会员才能提问&回复,快吧!如果你还没有账号你可以一个账号。
添加新技术问题
课程 [异步文件上传方式介绍]
中已存在问题
添加新技术问题
问题描述越详细,被解答的速度越快
有新回答时请邮件提醒我
着急,拜托快点
不急,慢慢解决
关联课程 [异步文件上传方式介绍]

我要回帖

更多关于 lua面向对象实现 的文章

 

随机推荐