使用AJAX技术实现网页无闪自动局部刷新_AJAX教程

推荐：Web2.0岁月使用AJAX技术的十大理由
　　保守来说，AJAX在现在是热得不能再热的技术。没有人能否认，它拥有大批的支持者。在CNN上，它从二月份的一个不被看好的词语到十月份成长成一个初具雏形的技术。所以，有必要要看看为什么

实例解决问题：

希望实现用户在进入系统以后（整个session的时效之内）,如果收到新邮件则发出声音提示。

实现思路：

1.首页部分：< body onload="init('<%=ses_userBean.getUsername()%>');"> // load时调用init(user);

2.js部分：用XMLHTTP实现页面局部刷新，调用check_mail.jsp对后台数据库进行检索判断并返回结果。

var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

var checkresult=null;

var username =null;

function init(user){

username=user;

window.setInterval('Checkmail()',5000);//每隔5秒自动调用Checkmail()

}

function Checkmail()

{

xmlhttp.open("POST", "check_mail.jsp?uName=" username, false);

xmlhttp.onreadystatechange = updatePage;

xmlhttp.send();

}

function updatePage() {

if (xmlhttp.readyState < 4) {

test1.innerHTML="loading...";

}

if (xmlhttp.readyState == 4) {

var response = xmlhttp.responseText;

if(response==1){//判断为假

test1.innerHTML=" ";

checkresult=1;

}

else{//判断为真

test1.innerHTML="

alt=新邮件 src=img/tp024.gif />

";

checkresult=0;

}

}

}

//

3.check_mail.jsp

<%@ page contentType="text/html; charset=GBK" %>

<%@ page errorPage="error/login_error.jsp"%>

<%@ page import="myweb.*" %>

<%@ page import="java.sql.*" %>

<%

String user=request.getParameter("uName");

Connection conn=null;

try{

conn=DBConnection.getConnection();

PreparedStatement pStat=conn.divpareStatement("

select * from message where r_name='" user "' and status=0");

ResultSet rs=pStat.executeQuery();

if(rs.next()){//有记录

response.getWriter().print(0);

}else{

response.getWriter().print(1);

}

}finally{

if(conn!=null) conn.close();

}

%>

4.首页结果显示

将< span id="test1" > < /span >插入指定位置。

分享：AJAX和传统的ASP无刷新技术比较
以下为引用的内容： 两者都是无刷新提取服务器(数据库)数据并实时显示在客户段，那为什么现在都要用 ajax呢，还要考虑中文编码等麻烦问题。ajax到底