我想网

Ajax 是一种可以通过Javascript, DHTML and the XMLHttpRequest 来发送GET或POST请求，在数据返回时不必重新载入页面。 下面是一个非常简单的Ajax例子，发送一个请求，打印出请求的字符串和远程用户的IP地址。
(全文 …)

Tags: Ajax
Posted in Ajax 评论关闭

Tags: Ajax, API, Library
Posted in Ajax, Extjs, JavaScript, JQuery, Prototype, Widget, YUI 评论关闭

jquery的代码:
(全文 …)

Tags: Ajax, ExtJS, JQuery
Posted in Ajax, Extjs, JQuery 评论关闭

//ajax声明
var xmlHttp; function createXMLHttpRequest() {
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);
} else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
}
//javascript调用执行back()方法启动
ajax function back() {
var url=”/websys/main/actionurl.do?paraname=123″; createXMLHttpRequest(); xmlHttp.open(“GET”, url); xmlHttp.onreadystatechange =callback; xmlHttp.send(null);
}
//回掉函数 function callback(){
if (xmlHttp.readyState == 4) {
if (xmlHttp.status == 200) {
var resstr=xmlHttp.responseText;
var ress=eval(“(“+resstr+”)”);
if(ress.msg==false){
alert(ress.value);
}else{
alert(ress.value);
}
}
}
//后台action
public ActionForward execute(…….)
throws IOException {
String paravalue=rerquest.getParameter(“paraname”);
PrintWriter out=response.getWriter();
if(paravalue.equals(“123″)) {
out.print(“{msg:’success’,value:’oknow!’}”);
return null;
} else {
out.print(“{msg:error,value:’error!’}”);
}
return null;
}
return null;
}

Tags: Ajax, Json
Posted in Ajax 评论关闭

在.JS文件或者网页中写入如下脚本

//定义XMLHttp实例
var xmlHttp;
function createXMLHttpRequest(){
//开始初始化XMLHttpRequest对象
if(window.ActiveXObject){
//IE浏览器
xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);
}else if(window.XMLHttpRequest){
//Mozilla浏览器
xmlHttp = new XMLHttpRequest();
}
if(xmlHttp){
xmlHttp.open(“GET”,url,false);
xmlHttp.onreadystatechange=function(){setState(greens,reds,contains)};
xmlHttp.send(null);
}
}
//回调函数举例
//返回的4种状态
function setState(greens,reds,contains){
var contains = document.getElementById(“contain”);
if(xmlHttp.readyState == 0){
contains.innerHTML = “正在初始化”;
}
if(xmlHttp.readyState == 1){
contains.innerHTML = “正在准备发送请求”;
}
if(xmlHttp.readyState == 2){
contains.innerHTML = “正在发送请求”;
}
if(xmlHttp.readyState == 3){
contains.innerHTML = “正在接收数据”;
}
if(xmlHttp.readyState == 4){
//信息已经成功返回，开始处理信息
if(xmlHttp.status == 200){
contains.innerHTML = xmlHttp.responstText; //返回值
}
}
}

DOM的一些详解

(1)设置
在从服务器返回数据的同时，还要进行设置，使浏览器不会在本地缓存结果，response.setHeader(“Cache-Control”,”no-cache”);response.setHeader(“pragma”,”no-cache”);
XMLHttpRequest对象提供２个可以用来访问服务器响应的属性，一个是responseText将响应提供一个串，结合HTML元 素的innerHTML属性，非常有用． (document.getElementById(“results”).innerHTML=xmlHttp.responseText).一个是 responseXML将响应提供为一个XML对象．

(2)DOM元素的一些有用的属性
childNodes————————————–返回当前元素所有子元素的数组
firstChild ————————————–返回当前元素的第一个下级子元素
lastChild —————————————返回当前元素的最后一个子元素
nextSibling—————————————返回紧跟在当前元素后面的元素
nodeValue—————————————-指定表示元素值的读／写属性
parentNode ————————————–返回元素的父节点
previousSibling———————————-返回紧邻当前元素之前的元素

(3)用于遍历XML文档的DOM元素方法(document)
getElementById(id)—————————–获取有指定唯一ID属性值文档中的元素
getElementsByTagName(name)————–返回当前元素中有指定标记名的子元素的数组
hasChildNodes()——————————–返回一个布尔值，指定元素是否有子元素
getAttribute(name)——————————返回元素的属性值，属性由name指定

(4)动态创建内容时所用的W3C DOM属性和方法
document.createElement(tagName)———-文档对象上的createElement方法可以创建由tagName指定的元素
document.createTextNode(text)————–文档对象的createTextNode方法会创建一个包含静态文本的节点．
<element></element>.appendChild(childNode)———该方法将指定的节点增加到当前元素的子节点列表．
<element></element>.getAttribute(name)|.setAttribute(name,value)—————–获得和设置元素中name属性的值
<element></element>.insertBefore(newNode,targetNode)—–这个方法将节点newNode作为当前元素的子节点插到targetNode元素前面。
<element></element>.removeAttribute(name)—–这个方法从元素中删除属性name
<element></element>.removeChild(childNode)—–这个方法从元素中删除子元素childNode
<element></element>.replaceChild(newNode,oldNode)—–这个方法将节点oldNode替换为节点newNode
<element></element>.hasChildNodes()这个方法返回一个布尔值，指示元素是否有子元素

XMLHttpRequest对象的一些典型方法

(1)、void open(String method,String url,boolean asynch);这个方法会建立对服务器的调用。
第一个参数表示要提供调用的特定方法(get,post,put)
第二个参数表示要提供所调用资源的url
第三个参数表示是异步(true)还是同步(false)
(2)、void send(content):这个方法会向具体服务器发出请求。可选参数会作为请求体的一部分发送。
(3)、void setRequestHeader(String header ,String value):这个方法为HTTP请求中一个给定的首部设置值
第一个参数表示要设置的首部。
第二个参数表示要 在首部中放置的值。这个方法必须在调用open()之后才能调用。
XMLHttpRequest对象的一些典型属性：
(1)、onreadystatechange:每个状态改变时都会触发这个事件处理器，通常会调用一个javascript函数，用来处理返回时要调用的函数。
(2)、readyState:请求的状态。有5个值：0=未初始化，1=正在加载，2=已经加载，3=交互中，4=完成。
(3)、responseText:服务器的响应，表示为一个串
(4)、responseXML:服务器的响应，表示为一个XML，这个对象可以解析为一个DOM对象。
(5)、status:服务器的Http状态码(200对应ok，404对应Not Found(未找到))

Tags: Ajax, XMLHTTP
Posted in Ajax 评论关闭

AJAX是web20的基石，现在网上流行几种开源的AJAX框架，比如：jQuery,Mootools,Dojo,Ext JS等等，那么我们到底在什么情况下该使用那个框架？以下是一组摘抄的数据：

Ajaxian在2007年底对Ajax工具进行了调查，部分调查结果见下表（其中数字为调查者使用该工具的百分比，详细的请参见网页）：http://ajaxian.com/archives/2007-ajax-tools-usage-survey-results (全文 …)

Tags: Ajax, Dojo, ExtJS, JQuery, Mootools
Posted in Ajax, JavaScript 评论关闭

现在距离gmail改变大家对使用网页应用程序的方式,已经有一年多了。但是目前很多网页应用程序,并没有使用充满活力的Ajax的优势,来代替以前沉闷的html功能。

下面是当前网页应用程序应该出现的地方：

* 基于表单的交互
(全文 …)

Tags: Ajax
Posted in Ajax 评论关闭

在.JS文件或者网页中写入如下脚本

//定义XMLHttp实例
var xmlHttp;
function createXMLHttpRequest(){
//开始初始化XMLHttpRequest对象
if(window.ActiveXObject){
//IE浏览器
xmlHttp = new ActiveXObject(“Microsoft.XMLHTTP”);
}else if(window.XMLHttpRequest){
//Mozilla浏览器
xmlHttp = new XMLHttpRequest();
}
if(xmlHttp){
xmlHttp.open(“GET”,url,false);
xmlHttp.onreadystatechange=function(){setState(greens,reds,contains)};
xmlHttp.send(null);
}
}
//回调函数举例
//返回的4种状态
function setState(greens,reds,contains){
var contains = document.getElementById(“contain”);
if(xmlHttp.readyState == 0){
contains.innerHTML = “正在初始化”;
}
if(xmlHttp.readyState == 1){
contains.innerHTML = “正在准备发送请求”;
}
if(xmlHttp.readyState == 2){
contains.innerHTML = “正在发送请求”;
}
if(xmlHttp.readyState == 3){
contains.innerHTML = “正在接收数据”;
}
if(xmlHttp.readyState == 4){
//信息已经成功返回，开始处理信息
if(xmlHttp.status == 200){
contains.innerHTML = xmlHttp.responstText; //返回值
}
}
}

DOM的一些详解

(1)设置
在从服务器返回数据的同时，还要进行设置，使浏览器不会在本地缓存结果，response.setHeader(“Cache-Control”,”no-cache”);response.setHeader(“pragma”,”no-cache”);
XMLHttpRequest对象提供２个可以用来访问服务器响应的属性，一个是responseText将响应提供一个串，结合HTML元 素的innerHTML属性，非常有用． (document.getElementById(“results”).innerHTML=xmlHttp.responseText).一个是 responseXML将响应提供为一个XML对象．

(2)DOM元素的一些有用的属性
childNodes————————————–返回当前元素所有子元素的数组
firstChild   ————————————–返回当前元素的第一个下级子元素
lastChild   —————————————返回当前元素的最后一个子元素
nextSibling—————————————返回紧跟在当前元素后面的元素
nodeValue—————————————-指定表示元素值的读／写属性
parentNode ————————————–返回元素的父节点
previousSibling———————————-返回紧邻当前元素之前的元素

(3)用于遍历XML文档的DOM元素方法(document)
getElementById(id)—————————–获取有指定唯一ID属性值文档中的元素
getElementsByTagName(name)————–返回当前元素中有指定标记名的子元素的数组
hasChildNodes()——————————–返回一个布尔值，指定元素是否有子元素
getAttribute(name)——————————返回元素的属性值，属性由name指定

(4)动态创建内容时所用的W3C DOM属性和方法
document.createElement(tagName)———-文档对象上的createElement方法可以创建由tagName指定的元素
document.createTextNode(text)————–文档对象的createTextNode方法会创建一个包含静态文本的节点．
<element></element>.appendChild(childNode)———该方法将指定的节点增加到当前元素的子节点列表．
<element></element>.getAttribute(name)|.setAttribute(name,value)—————–获得和设置元素中name属性的值
<element></element>.insertBefore(newNode,targetNode)—–这个方法将节点newNode作为当前元素的子节点插到targetNode元素前面。
<element></element>.removeAttribute(name)—–这个方法从元素中删除属性name
<element></element>.removeChild(childNode)—–这个方法从元素中删除子元素childNode
<element></element>.replaceChild(newNode,oldNode)—–这个方法将节点oldNode替换为节点newNode
<element></element>.hasChildNodes()这个方法返回一个布尔值，指示元素是否有子元素

XMLHttpRequest对象的一些典型方法

(1)、void open(String method,String url,boolean asynch);这个方法会建立对服务器的调用。
第一个参数表示要提供调用的特定方法(get,post,put)
第二个参数表示要提供所调用资源的url
第三个参数表示是异步(true)还是同步(false)
(2)、void send(content):这个方法会向具体服务器发出请求。可选参数会作为请求体的一部分发送。
(3)、void setRequestHeader(String header ,String value):这个方法为HTTP请求中一个给定的首部设置值
第一个参数表示要设置的首部。
第二个参数表示要 在首部中放置的值。这个方法必须在调用open()之后才能调用。
XMLHttpRequest对象的一些典型属性：
(1)、onreadystatechange:每个状态改变时都会触发这个事件处理器，通常会调用一个javascript函数，用来处理返回时要调用的函数。
(2)、readyState:请求的状态。有5个值：0=未初始化，1=正在加载，2=已经加载，3=交互中，4=完成。
(3)、responseText:服务器的响应，表示为一个串
(4)、responseXML:服务器的响应，表示为一个XML，这个对象可以解析为一个DOM对象。
(5)、status:服务器的Http状态码(200对应ok，404对应Not Found(未找到))

Tags: Ajax
Posted in Ajax, JavaScript 评论关闭

翻译:PARAN

当谈到表格数据的设计时，没有太多的网页设计师会有太大的兴趣。今天我们已经收集了21个功能超大且看上去挺漂亮的Ajax/CSS表格设计，并且教你一些表格设计中所运用的技巧，例如表格数据的排序和过滤等。

OK，让我们来看一下这些表格:

1. Tablecloth

Tablecloth 由CSS Globe 开发，是一个轻巧易于使用的表格，简洁的将表格样式添加到你的HTML 表格元素中。

2. Ask the CSS Guy Table

Ask the CSS Guy Table教给我们要如何去创建能够清晰显出去资料之间的相关联系的表格，例如:点击一个表格元素时，将突了显示这个元素，并且在纵列和横列都显示出相关的类别关系。

(全文 …)

Tags: Ajax, CSS
Posted in Ajax, CSS, JavaScript 评论关闭