梅花雪老大请进：如何自定义树型控件的右键菜单

个人认为梅花雪的很好，你看CSDN论坛左侧的那个树就是梅花雪的，下载地址是：
http://www.meizz.com/Web/Demo/MzTreeView10.htm

解决方案 »

  1.   

    在oncontextmenu方法触发一个显示菜单的事件
      

  2.   

    例如:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <script language="javascript">
    function Point(iX, iY){
    this.x = iX;
    this.y = iY;
    }
    function fGetXY(aTag){
      var oTmp = aTag;
      var pt = new Point(0,0);
      do {
       pt.x += oTmp.offsetLeft;
       pt.y += oTmp.offsetTop;
       oTmp = oTmp.offsetParent;
      } while(oTmp!=null);
      return pt;
    }
    function showDiv(div,pos){
    var pt=fGetXY(pos);
    div.style.left=pt.x+pos.offsetWidth;
    div.style.top=pt.y+pos.offsetHeight;
    div.style.display='block';
    }
    function hideDiv(div){
    div.style.display='none';
    alert()
    }
    </script>
    <style type="text/css">
    <!--
    #Layer1 {
    position:absolute;
    width:150px;
    height:50px;
    z-index:1;
    background-color: #FFFFCC;
    display:none;
    }
    .key{
    cursor:hand;
    color:blue;
    font-size:12px;
    }
    -->
    </style>
    </head>
    <body topmargin="100" leftmargin="100">
    <div id="Layer1">啦啦啦，出现了。</div>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    <p><span oncontextmenu="showDiv(Layer1,this); return false" class="key">测试链接</span></p>
    </body>
    </html>
      

  3.   

    自己搞定，不过采用了一个折中的办法：
    我需要将tree放入一个iframe中
    方法是我在tree下又放了一个iframe，name是“edit_tree”，然后将tree的id值传入edit_tree的iframe，在下面的iframe中对tree进行编辑、添加、删除等操作。