随笔-60  评论-138  文章-1  trackbacks-0
前提:
     我最近在公司和师哥学习js,用来对www.51ditu.com进行优化。把一些学习的点滴放在这里。
     本文要记录是怎么实现www.51ditu.com中point点的tips框中怎么显示当前point是否有宝物!
     首先我需要构建好这个tip框中的html:
      html += "<tr><td id='Baowu'></td></tr></table></div>";
      var m = getMarker(poi.point, i+1, tmp.n, html);//调用函数生成marker
      LTEvent.bind(m,"viewstylechange",m,onViewStyleChange);    
      当中的 getMarker是实实在在的产生tips的函数,他会限定好样式和格式,并且将内容的html来填充!
      最后一句话很关键,师哥将onViewStyleChange这个函数绑定在marker上!
       在getMarker这个函数中触发viewstylechange,并且传递一个参数过来!
       LTEvent.trigger(this,"viewstylechange",[v]);
       继而下面的增加宝物的方法被触发:
       function onViewStyleChange(v)
     {
         if(v!=2){return;}
        var jload = JsLoader.getInstance();
        //callback
        jload.setFun(LTEvent.getCallback(this,treasure));
         jload.connect( "http://huodong.51ditu.com/xunbaotc/ts?kw="+this.mname );
     }
      当中的jload会使用ajax方法来判断当前地点是不是有宝物!他的回调函数是:  jload.setFun(LTEvent.getCallback(this,treasure));

       function treasure(){
        //获取到marker中的属性,这就是上边把onViewStyleChange这个函数绑定在marker上的主要目的!
         alert(this.mname);
       }
     在这个函数中我通过dom解析,找到 html += "<tr><td id='Baowu'></td></tr></table></div>";将相应的html补充!

     以上纯属纪录,我自己也在学习!
      真实效果请关注:www.51ditu.com,对于js部分可以参见:http://api.51ditu.com

      
 

    效果如下:
     
posted on 2007-08-22 15:28 张氏兄弟 阅读(329) 评论(0)  编辑  收藏 所属分类: js

只有注册用户登录后才能发表评论。


网站导航: