[转载]运用AJAX实现右下角弹出提示框示例

野蛮女人

高级会员

Rank: 4

帖子: 812
精华: 1
性别: 女
注册时间: 2007-4-7

1^# 大中小发表于 2007-9-5 18:38 只看该作者

[转载]运用AJAX实现右下角弹出提示框示例

复制内容到剪贴板

代码:

//定义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; out=out+(i+1)+"."+"<a style=\"font-size:12px; color: #6D93C8; face: Tahoma\" title='内容提要：\n" +title +"\n时间：" +title +"'"+" href=# >" +title +"</a> "; } popmsg(" "+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>"); %>

搜索更多相关主题的帖子: AJAX 示例 xmlHttp 浏览器 Microsoft

TOP

野蛮女人

高级会员

Rank: 4

帖子: 812
精华: 1
性别: 女
注册时间: 2007-4-7

2^# 大中小发表于 2007-9-5 18:38 只看该作者

复制内容到剪贴板

代码:

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>右下角弹出提示</title> </head> <script type="text/javascript" src="ajax.js"></script> <body> <input type="button" onclick="createXMLHttpRequest()" value="测试请求" /> <div id="contain"></div> </body> </html>

[shadow=255,purple,5]好人不长命,祸害一万年![/shadow]