随笔 - 1330  文章 - 1  评论 - 378  阅读 - 482万 

模拟"开心网"消息提示的小例子

JS代码如下:

复制代码
 1//消息
 2        function HeadMessage(alertMsg,hiddenAlertMsg)
 3        {
 4            this.alertFlag = false;
 5            this.intervalId = "";
 6            this.alertMsg = alertMsg;
 7            this.hiddenAlertMsg = hiddenAlertMsg;
 8        }
 9        
10        //初始化定时器
11        HeadMessage.prototype.initAlert = function(functionName)
12        {
13            this.intervalId = setInterval("messageAlert()",1000);
14        }
15        //清除定时器
16        HeadMessage.prototype.clearAlert = function(title)
17        {
18            if(this.intervalId != "")
19            {
20                clearInterval(this.intervalId);
21                this.intervalId = "";
22                document.title = title;
23            }
24        }
25        //Prototype Ajax 获取返回值
26        HeadMessage.prototype.oversee = function(requestUrl)
27        {
28            new Ajax.Request
29            (
30                requestUrl,
31                {
32                    method:"post",
33                    onComplete:function(request)
34                    {
35                        if(parseInt(request.responseText) > 0 && this.intervalId == "")
36                        {
37                            this.initAlert();
38                        }
39                        else if(parseInt(request.responseText) <= 0)
40                        {
41                            this.clearAlert("测试消息提示警告");
42                        }
43                    }
44                }
45            )
46        }
47        //测试方法
48        HeadMessage.prototype.overlook = function(id)
49        {
50            var textVal = document.getElementById(id).value;
51            if(parseInt(textVal) > 0 && this.intervalId == "")
52            {
53                this.initAlert();
54            }
55            else if(parseInt(textVal) <= 0)
56            {
57                this.clearAlert("测试消息提示警告");
58            }
59        }
60        //闪烁判断
61        function messageAlert()
62        {
63            if(msg.alertFlag)
64            {
65                msg.alertFlag = false;
66                document.title = msg.alertMsg;
67            }
68            else
69            {
70                if(msg.intervalId  != "")
71                {
72                    document.title = msg.hiddenAlertMsg;
73                    msg.alertFlag = true;
74                }
75            }
76        }
复制代码

 

HTML模拟测试代码如下:

 

复制代码
 1<html>
 2    <head>
 3        <title>测试消息提示警告</title>
 4        <script type="text/javascript" src="/js/prototype.js"></script>
 5        <script type="text/javascript" src="/js/headmessage.js"></script>
 6        <script type="text/javascript">
 7        var msg = new HeadMessage("【新消息】","【　　　】");
 8        function overseeState()
 9        {
10            var intervalId = setInterval("msg.overlook('tId')",1000);
11        }
12        overseeState();
13    </script>
14    </head>
15    
16    <body>
17        <input type="text" id = "tId" name = "tId"/>
18    </body>
19</html>
复制代码
posted on   钱途无梁  阅读(514)  评论(1)  编辑  收藏  举报
编辑推荐：
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列：如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
阅读排行：
· winform 绘制太阳，地球，月球 运作规律
· AI与.NET技术实操系列（五）：向量存储与相似性搜索在 .NET 中的实现
· 超详细：普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码？零基础破解AI编程运行原理
· 上周热点回顾（3.3-3.9）
点击右上角即可分享
微信分享提示
AI IDE Trae