ajax - 回調(diào)函數(shù)Observer實現(xiàn)例子

          1.EventRouter.js
          /**
          ?* @author user
          ?*/
          var jsEvent = new Array();
          jsEvent.EventRouter = function(el,eventType){
          ?this.lsnrs = new Array();
          ?this.el = el;
          ?el.eventRouter = this;
          ?el[eventType] = jsEvent.EventRouter.callback;
          };
          jsEvent.EventRouter.prototype.addListener = function(lsnr){
          ?this.lsnrs.append(lsnr,true);?
          } ;

          jsEvent.EventRouter.prototype.notify = function(e){
          ?var lsnrs = this.lsnrs;
          ?for(var i=0;i<lsnrs.length;i++){
          ??var lsnr = lsnrs[i];
          ??lsnr.call(this,e);
          ?}
          };
          jsEvent.EventRouter.callback=function(event){
          ?var e = event || window.event;
          ?var router = this.eventRouter;
          ?router.notify(e);
          };

          Array.prototype.append = function(obj,nodup){
          ?if(nodup){?
          ??this[this.length]=obj;
          ?}
          };

          2.mousemat.css
          .mousemat{
          ?background-color:#ffe0d0;
          ?border:solid maroon 0px;
          ?position:absolute;
          ?margin:0px;
          ?width:500px;
          ?height:500px;
          ?top:50px;
          ?left:50px;?
          }
          .thumbnail{
          ?background-color:#ffe0d0;
          ?border:solid maroon 0px;
          ?position:absolute;
          ?margin:0px;
          ?width:100px;
          ?height:100px;
          ?top:50px;
          ?left:600px;?
          }
          .cursor{
          ?background-color:blue;
          ?position:relative;
          ?height:5px;
          ?width:5px;
          }

          3.mousemat.htm
          <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "<html>
          ?<head>
          ??<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
          ??<title>Untitled Document</title>
          ??<link rel='stylesheet' type = 'text/css' href = 'mousemat.css'>
          ??<script type ='text/javascript' src = 'EventRouter.js'></script>
          ??<script type='text/javascript'>
          ???var cursor = null;
          ???window.onload = function(){
          ????var mat = document.getElementById('mousemat');
          ????cursor = document.getElementById('cursor');
          ????var mouseRouter = new jsEvent.EventRouter(mat,"onmousemove");
          ????//var mouseRouter = new jsEvent.EventRouter(mat,"onclick");
          ????mouseRouter.addListener(writeStatus);
          ????mouseRouter.addListener(drawThumbnail);
          ???};
          ???function writeStatus(e){
          ????window.status = e.clientX + "," + e.clientY;
          ???}
          ???function drawThumbnail(e){
          ????cursor.style.left = ((e.clientX/5)-2) + "px";
          ????cursor.style.top = ((e.clientY/5)-2) + "px";
          ???}
          ??</script>
          ?</head>
          ?<body>
          ??<div class='mousemat' id='mousemat'></div>
          ??<div class='thumbnail' id='thumbnail'>
          ???<div class = 'cursor' id = 'cursor'></div>
          ??</div>
          ?</body>
          </html>

          posted on 2006-08-14 08:50 software5168 閱讀(773) 評論(0)  編輯  收藏 所屬分類: Java學(xué)習(xí)

          <2006年8月>
          303112345
          6789101112
          13141516171819
          20212223242526
          272829303112
          3456789

          導(dǎo)航

          統(tǒng)計

          常用鏈接

          留言簿(3)

          隨筆分類

          隨筆檔案

          收藏夾

          JAVA學(xué)習(xí)網(wǎng)站

          綜合

          搜索

          積分與排名

          最新評論

          閱讀排行榜

          評論排行榜

          主站蜘蛛池模板: 乌苏市| 江都市| 清原| 株洲县| 开平市| 卫辉市| 本溪市| 土默特左旗| 昌邑市| 南溪县| 和静县| 文安县| 东光县| 社旗县| 开阳县| 陇南市| 和静县| 焉耆| 曲阜市| 科技| 嘉荫县| 拜泉县| 锦州市| 镇远县| 沐川县| 当阳市| 洪洞县| 五峰| 龙门县| 阳城县| 洛南县| 枣庄市| 秦安县| 太康县| 石泉县| 霍林郭勒市| 靖西县| 石屏县| 乐昌市| 陕西省| 定西市|