JavaScript MSN 弹出消息框,并保存到cookie

于 2010-03-24 17:04:00 发布
阅读量772 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： javascript function xmlhttprequest class null domain
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/mark_2000/article/details/5412762
本文介绍了一个利用JavaScript实现的异步请求方法，并详细解释了如何处理后台返回的数据，同时还展示了一个类似MSN消息框的功能实现，用于显示通知或消息。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

<script type="text/javascript">

  /*

  * 异步同步

  */

  var windowsettel;

  function getNewXmlHttpRequest() { 

var A=null; 

try { 

A=new ActiveXObject("Msxml2.XMLHTTP");

} catch(e) { 

try { 

A=new ActiveXObject("Microsoft.XMLHTTP");

} catch(oc) { 

A=null;

} 

} 

if ( !A && typeof XMLHttpRequest != "undefined" ) { 

A=new XMLHttpRequest();

} 

return A;

}

 

 windowsettel = window.setInterval("startSearch()",20000); 

 

function startSearch(){

//发送请求给服务

var xmlHttp = getNewXmlHttpRequest();

xmlHttp.onreadystatechange = function(){

if (xmlHttp.readyState == 4) {

   if (xmlHttp.status == 200) {

var doc = xmlHttp.responseText;

  dealGatePassHead(doc);

}

}

};

xmlHttp.open("POST", "/portal/sysMessage.do?id=270&newTime="+new Date().getTime(), false);

xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

xmlHttp.send("");

}

 

 /*处理后台返回的值*/

function dealGatePassHead(resp){

//alert(resp);

var func = new Function("return "+resp);

var json = func();//请看json数据处理格式

if(json.cmInfo.length>0){

var qiObj = false;

qiObj = json.cmInfo[0];

if(qiObj.id!=""){

document.getElementById("hiddenID").value = qiObj.id;

document.getElementById("columnid1").value = qiObj.columnid;

document.getElementById("title1").value = qiObj.title;

document.getElementById("content1").value = qiObj.content;

   if(qiObj.tagcheck =='0' || qiObj.tagcheck =='2'){

     var nameObj = GetCookie("sysMessage1");

     //alert(nameObj+"========"+qiObj.id);

     if(nameObj!=qiObj.id){

            QueryMessage();

          }       

        }

          var expdate = new Date ();

                       expdate.setTime (expdate.getTime() + (24 * 60 * 60 * 1000 * 31));

       SetCookie ("sysMessage1", qiObj.id, expdate);

      }

 }

}

 

</script>

<SCRIPT LANGUAGE="JavaScript">

/******************************************************

*  cookie记录用户姓名 Share JavaScript (http://www.ShareJS.com)

* 使用此脚本程序，请保留此声明

* 获取此脚本以及更多的JavaScript程序，请访问 http://www.ShareJS.com

******************************************************/

 

function getCookieVal (offset) {

var endstr = document.cookie.indexOf (";", offset);

if (endstr == -1)

endstr = document.cookie.length;

return unescape(document.cookie.substring(offset, endstr));

}

 

/*

* 获取cookie数据

*/

function GetCookie (name) {

var arg = name + "=";

var alen = arg.length;

var clen = document.cookie.length;

var i = 0;

while (i < clen) {

var j = i + alen;

if (document.cookie.substring(i, j) == arg)

return getCookieVal (j);

i = document.cookie.indexOf(" ", i) + 1;

if (i == 0) break; 

}

return null;

} 

/*

* 保存cookie

*/

function SetCookie (name, value) {

var argv = SetCookie.arguments;

var argc = SetCookie.arguments.length;

var expires = (argc > 2) ? argv[2] : null;

var path = (argc > 3) ? argv[3] : null;

var domain = (argc > 4) ? argv[4] : null;

var secure = (argc > 5) ? argv[5] : false;

document.cookie = name + "=" + escape (value) +

((expires == null) ? "" : ("; expires=" + expires.toGMTString())) +

((path == null) ? "" : ("; path=" + path)) +

((domain == null) ? "" : ("; domain=" + domain)) +

((secure == true) ? "; secure" : "");

}

 

</SCRIPT>

<script language="JavaScript" type="text/javascript">  

/** 

**    ==================================================================================================  

**    类名：CLASS_MSN_MESSAGE  

**    功能：提供类似MSN消息框  

**    示例：  

    ---------------------------------------------------------------------------------------------------  

 

            var MSG = new CLASS_MSN_MESSAGE("aa",200,120,"短消息提示：","您有1封消息","今天请我吃饭哈");  

                MSG.show();  

/**  

 *    消息构造  

 */  

function CLASS_MSN_MESSAGE(id,width,height,caption,title,message,target,action){  

    this.id     = id;  

    this.title  = title;  

    this.caption= caption;  

    this.message= message;  

    this.target = target;  

    this.action = action;  

    this.width  = width?width:200;  

    this.height = height?height:120;  

    this.timeout= 3000;  

    this.speed  = 20; 

    this.step   = 1; 

    this.right  = screen.width -1;  

    this.bottom = screen.height; 

    this.left   = this.right - this.width; 

    this.top    = this.bottom - this.height; 

    this.timer  = 0; 

    this.pause  = false;

    this.close  = false;

    this.autoHide = true;

}  

 

/**

 * 隐藏消息方法  

 */  

CLASS_MSN_MESSAGE.prototype.hide = function(){  

    if(this.onunload()){  

        var offset  = this.height>this.bottom-this.top?this.height:this.bottom-this.top; 

        var me  = this;  

        if(this.timer>0){   

            window.clearInterval(me.timer);  

        }  

        var fun = function(){  

            if(me.pause==false||me.close){

                var x  = me.left; 

                var y  = 0; 

                var width = me.width; 

                var height = 0; 

                if(me.offset>0){ 

                    height = me.offset; 

                } 

                y  = me.bottom - height; 

                if(y>=me.bottom){ 

                    window.clearInterval(me.timer);  

                    me.Pop.hide();  

                } else { 

                    me.offset = me.offset - me.step;  

                } 

                me.Pop.show(x,y,width,height);    

            }             

        }  

        this.timer = window.setInterval(fun,this.speed)      

    }  

}  

 

/**  

 *   消息卸载事件，可以重写  

 */  

CLASS_MSN_MESSAGE.prototype.onunload = function() {

    this.close=true; //加了这一句   

    return true;  

}  

/**  

 *   消息命令事件，要实现自己的连接，请重写它  

 *  

 */  

CLASS_MSN_MESSAGE.prototype.oncommand = function(){  

    this.close = true;

    this.hide();

    //获取到ID号

    //var xID = document.getElementById("hiddenID").value; 

    //window.open("<%=request.getContextPath()%>/protal/cms/model/multiplypic/ShowInfo.jsp?front=1&id="+xID+"&skin="+getcss(),"","height=600, width=850, top=100, left=100, toolbar=no, menubar=no, scrollbars=yes, resizable=yes,location=no, status=no"); 

}  

 

/**  

 *   消息显示方法  

 */  

CLASS_MSN_MESSAGE.prototype.show = function(){  

 

    var oPopup = window.createPopup(); //IE5.5+  

    this.Pop = oPopup;  

    var w = this.width;  

    var h = this.height;

    /*  

    var str = "<DIV style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 0px; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: " + w + "px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: " + h + "px; BACKGROUND-COLOR: #c9d3f3'>"  

        str += "<TABLE style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid' cellSpacing=0 cellPadding=0 width='100%' bgColor=#cfdef4 border=0>"  

        str += "<TR>"  

        str += "<TD style='FONT-SIZE: 12px;COLOR: #0f2c8c' width=30 height=24></TD>"  

        str += "<TD style='PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #1f336b; PADDING-TOP: 4px' vAlign=center width='100%'>" + this.caption + "</TD>"  

        str += "<TD style='PADDING-RIGHT: 2px; PADDING-TOP: 2px' vAlign=center align=right width=19>"  

        str += "<SPAN title=关闭 style='FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px' id='btSysClose'>×</SPAN></TD>"  

        str += "</TR>"  

        str += "<TR>"  

        str += "<TD style='PADDING-RIGHT: 1px;PADDING-BOTTOM: 1px' colSpan=3 height=" + (h-28) + ">"  

        str += "<DIV style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 8px; FONT-SIZE: 12px; PADDING-BOTTOM: 8px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 8px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%'>" + this.title + "<BR><BR>"  

        str += "<DIV style='WORD-BREAK: break-all' align=left><FONT color=#ff0000>" + this.message + "</FONT></DIV>"  

        str += "</DIV>"  

        str += "</TD>"  

        str += "</TR>"  

        str += "</TABLE>"  

        str += "</DIV>"  

        */

    var str = "<DIV style='BORDER-RIGHT: #455690 1px solid; BORDER-TOP: #a6b4cf 1px solid; Z-INDEX: 99999; LEFT: 0px; BORDER-LEFT: #a6b4cf 1px solid; WIDTH: " + w + "px; BORDER-BOTTOM: #455690 1px solid; POSITION: absolute; TOP: 0px; HEIGHT: " + h + "px; BACKGROUND-COLOR: #c9d3f3'>" 

        str += "<TABLE style='BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid' cellSpacing=0 cellPadding=0 width='100%' bgColor=#cfdef4 border=0>" 

        str += "<TR>" 

        str += "<TD style='FONT-SIZE: 12px;COLOR: #0f2c8c' width=30 height=24></TD>" 

        str += "<TD style='PADDING-LEFT: 4px; FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #1f336b; PADDING-TOP: 4px' vAlign=center width='100%'>" + this.caption + "</TD>" 

        str += "<TD style='PADDING-RIGHT: 2px; PADDING-TOP: 2px' vAlign=center align=right width=19>" 

        str += "<SPAN title=关闭 style='FONT-WEIGHT: bold; FONT-SIZE: 12px; CURSOR: hand; COLOR: red; MARGIN-RIGHT: 4px' id='btSysClose' >×</SPAN></TD>" 

        str += "</TR>" 

        str += "<TR>" 

        str += "<TD style='PADDING-RIGHT: 1px;PADDING-BOTTOM: 1px' colSpan=3 height=" + (h-28) + ">" 

        str += "<DIV style='BORDER-RIGHT: #b9c9ef 1px solid; PADDING-RIGHT: 8px; BORDER-TOP: #728eb8 1px solid; PADDING-LEFT: 8px; FONT-SIZE: 12px; PADDING-BOTTOM: 8px; BORDER-LEFT: #728eb8 1px solid; WIDTH: 100%; COLOR: #1f336b; PADDING-TOP: 8px; BORDER-BOTTOM: #b9c9ef 1px solid; HEIGHT: 100%'>" + this.title + "<BR><BR>" 

        str += "<DIV style='WORD-BREAK: break-all' align=left><A href='javascript:void(0)' hidefocus=false id='btCommand'><FONT color=#ff0000>" + this.message + "</FONT></A></DIV>" 

        str += "</DIV>" 

        str += "</TD>" 

        str += "</TR>" 

        str += "</TABLE>" 

        str += "</DIV>" 

    oPopup.document.body.innerHTML = str; 

    this.offset  = 0; 

    var me  = this;  

 

    oPopup.document.body.onmouseover = function(){me.pause=true;}

    oPopup.document.body.onmouseout = function(){me.pause=false;}

 

    var fun = function(){  

        var x  = me.left; 

        var y  = 0; 

        var width = me.width; 

        var height = me.height; 

 

        if(me.offset>me.height){ 

             height = me.height; 

        } else { 

             height = me.offset; 

        } 

        y  = me.bottom - me.offset; 

        if(y<=me.top){ //让消息框消失

 

            me.timeout--; 

 

            if(me.timeout==0){ //当消息框在页面中显示的时间到期时，将消息框隐藏

 

                window.clearInterval(me.timer); 

 

                if(me.autoHide){

                    me.hide(); 

                }

            } 

        } else { 

            me.offset = me.offset + me.step; 

        } 

        me.Pop.show(x,y,width,height);    

    } 

 

    this.timer = window.setInterval(fun,this.speed);  

 

    var btClose = oPopup.document.getElementById("btSysClose");  

        btClose.onclick = function(){  

       me.close = true;

       me.hide();  

        }  

 

    var btCommand = oPopup.document.getElementById("btCommand");  

        btCommand.onclick = function(){  

           me.oncommand();  

         }    

}  

/**

** 设置速度方法 

**/ 

CLASS_MSN_MESSAGE.prototype.speed = function(s){ 

    var t = 20; 

    try { 

        t = praseInt(s); 

    } catch(e){} 

    this.speed = t; 

} 

/** 

** 设置步长方法 

**/ 

CLASS_MSN_MESSAGE.prototype.step = function(s){ 

    var t = 1; 

    try { 

        t = praseInt(s); 

    } catch(e){} 

    this.step = t; 

} 

 

CLASS_MSN_MESSAGE.prototype.rect = function(left,right,top,bottom){ 

    try { 

        this.left = left!=null?left:this.right-this.width; 

        this.right = right!=null?right:this.left +this.width; 

        this.bottom = bottom!=null?(bottom>screen.height?screen.height:bottom):screen.height; 

        this.top = top!=null?top:this.bottom - this.height; 

    } catch(e){} 

}

 

//--------------------------------------------------------------------------------------------

 

function QueryMessage(){ 

   //alert(document.getElementById("title1").value+"======="+document.getElementById("content1").value);

var MSG1 = new CLASS_MSN_MESSAGE("aa",600,500,"系统消息提示:",document.getElementById("title1").value,document.getElementById("content1").value);

MSG1.rect(null,null,null,screen.height-50); 

MSG1.speed = 3; 

MSG1.step = 5; 

MSG1.autoHideTimeOut = 2000;

if(document.getElementById("hiddenID").value!=''){

MSG1.show();

}

}

 

/*

var RUN = false; 

 

function QueryMessage(){ 

 

 if(RUN == false){ 

RUN = true; 

   //alert(document.getElementById("title1").value+"======="+document.getElementById("content1").value);

var MSG1 = new CLASS_MSN_MESSAGE("aa",600,500,"系统消息提示:",document.getElementById("title1").value,document.getElementById("content1").value);

MSG1.rect(null,null,null,screen.height-50); 

MSG1.speed = 5; 

MSG1.step = 5; 

MSG1.autoHideTimeOut = 2000;

if(document.getElementById("title1").value!=''){

MSG1.show();

}

} 

 

} */

/**

*发送信息

*/

/*

function ShowMessage(){

//定时查询是否有消息 

  var oInterval;

 

  oInterval = window.setInterval("QueryMessage()",5000);

 

  CLASS_MSN_MESSAGE.prototype.onend = function() { 

RUN = false;

} 

if(typeof(oInterval)=="undefined"){ 

document.title = "显示消息失败"; 

} 

}

*/

 

//在加载时候主动获取框架的风格关键字

function  getcss() {

if(window.parent!=null) {

return window.parent.sendcss();

}else{

return "";

}

} 

 

window.attachEvent("onload",startSearch); 

 

</script>

mark_2000
关注
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值