运用AJAX实现右下角弹出提示框示例

来源：互联网发布：苹果4刷机软件编辑：程序博客网时间：2024/05/01 05:29

作者
：http://hi.baidu.com/yehaiping1214/blog/item/de26fc09a4ba6fc73bc763cc.html

//定义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","message.do?cmd=get",true);
xmlHttp.onreadystatechange=setState;//设置回调函数
xmlHttp.send(null);
}
}
//回调函数
function setState(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
parseResults(xmlHttp.responseXML)
}
}
}
/*处理XML*/
function parseResults(xmlDOM) {
try{
var root = xmlDOM.documentElement;
var info = root.getElementsByTagName('message');
var out = "";
var message = null;
var current = null;
for(var i=0;i<info.length;i++){
message = info[i];
id = message.getElementsByTagName("id")[0].firstChild.data;
title = message.getElementsByTagName("title")[0].firstChild.data;
outout=out+(i+1)+"."+"<a style=/"font-size:12px; color: #6D93C8; face: Tahoma/" title='内容提要：/n"
+title
+"/n时间："
+title
+"'"+" href=# >"
+title
+"</a><BR>";
}
popmsg("<BR>"+out);
}catch(exception){
// alert("出错了！");
}
}
/*右下角提示框*/
var oPopup = window.createPopup();
var popTop=50;
function popshow(){
oPopup.show(screen.width-250,screen.height-popTop,241,172);
}
function pophide(){
oPopup.hide();
}
function popmsg(msgstr){
var winstr="<table valign=/"top/" style=/"border: 1 solid #6D93C8/" width=/"241/" height=/"172/" border=/"0/" cellpadding=/"0/" cellspacing=/"0/" >";
winstr+="<tr><td bgcolor=/"#BCCCDF/" onClick=/"parent.pophide();/" valign=/"top/" align=/"center/" height=/"20/" style=/"font-size:14px; color: #6D93C8; face: Tahoma;filter:Blur(add=1,direction=45,strength=8) /">你有新短消息：</td></tr><tr><td valign=/"top/" align=/"center/"><table valign=/"top/" width=/"90%/" height=/"110/" border=/"0/" cellpadding=/"0/" cellspacing=/"0/">";
winstr+="<tr><td valign=/"top/" style=/"font-size:12px; color: #6D93C8; face: Tahoma/">"+msgstr+"</td></tr></table></td></tr></table>";
oPopup.document.body.innerHTML = winstr;
popshow();
setInterval('window.focus()',0); //让IE重获取焦点
}
/*提示间隔时间*/
var secs=5;//第一次提示时间秒
function checkServer(secs){
for(i=1;i<=secs;i++) {
window.setTimeout("update(" + i + ")", i * 1000);
}
}
function update(num) {
if(num == secs) {
createXMLHttpRequest();
secs=1*60;//提示时间秒
for(i=1;i<=secs;i++) {
window.setTimeout("update(" + i + ")", i * 1000);
}
}
else {
printnr = secs-num;
}
}
checkServer(secs);

请求的XML内容

代码

<?xml version="1.0" encoding="UTF-8"?>
<messages>
<message>
<id>001</id>
<title>通知你今天来开会</title>
</message>
</messages>

如果XML要动态生成则用下面代码

代码

<%@ page import="java.util.List,com.sunflower.model.Message" contentType="text/xml;charset=utf-8"%>
<%
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
List list = (List)request.getAttribute("messages");
out.println("<messages>");
if(list!=null)
for(int i=0;i<list.size();i++){
Message objM = (Message)list.get(i);
out.println("<message>");
out.println("<id>"+objM.getId()+"</id>");
out.println("<title>"+objM.getTitle()+"</title>");
out.println("</message>");
}
out.println("</messages>");
%>

HTML文件内容

代码

运用AJAX实现右下角弹出提示框 示例

运用AJAX实现右下角弹出提示框示例