模擬開心網新消息

最近在做公司的項目的用到了 類似開心網上新消息的功能,本人寫了一個js的函數實現此功能,供大家交流:-)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE>測試頁面</TITLE>
  <script type="text/javascript">
	var dynamicMsg = null;
	function init() {
		dynamicMsg = new DynamicMessage(window.document.title, "【HI,消息】", "【     】");
	}

	function begin() {
		dynamicMsg.initIntervalMsg();
	}

	function end() {
		dynamicMsg.clearIntervalMsg();
	}

	/**
	  * 處理新消息提示的操作
	  */
	  function DynamicMessage(defaultMsg, msg, hiddenMsg) {
		this.initIntervalMsg = function() {
			this.intervalMsg = setInterval(function() {
					if(!this.bMsg) {
						window.document.title = msg + " - " + defaultMsg;
						this.bMsg = true;
					} else {
						window.document.title = hiddenMsg + " - " + defaultMsg;
						this.bMsg = false;
					}  		
				}, 
				1000
			  );
		  };
		  
		  this.clearIntervalMsg = function() {
			if(this.intervalMsg != null) {
				clearInterval(this.intervalMsg);
				window.document.title = defaultMsg;
				this.bMsg = false;
			}
		  };
	  }
  </script>
 </HEAD>
 <BODY οnlοad="init();">
	<center>
		<input type="button" value="begin" οnclick="begin();"/>
		<input type="button" value="end" οnclick="end();"/>
		<br/>
		coloryeah - 爲意識增添色彩!
	</center>
 </BODY>
</HTML>

由於這個對象沒有初始化太多次和涉及閉包的操作,故沒有采用prototype原型。

好啦,一個簡單實用的 hi,消息 完成了。

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章