右键菜单

最新推荐文章于 2024-11-13 01:18:00 发布

lord_llz

最新推荐文章于 2024-11-13 01:18:00 发布

阅读量853

点赞数

分类专栏： javascript 文章标签： function behavior null htc javascript table

javascript 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

<!--

作者：梅雪香(meixx)
时间：2005-11-7
描述：MxxPopMenu(htc) v1.0
调用方法:在<head></head>中添加
   <style type="text/css">
      .popMenu{ behavior: url(MxxPopMenu.htc);}
   </style>
   为需要菜单的对象添加 class="popMenu"
   e.g:<body class ="popMenu"></body>
-->

<public:component>
   <public:property name="description"    value="Editable table" />
   <public:property name="version"     value="1.0.0.0" />

<public:attach event="oncontentready" onevent="init()" />
<public:attach event="oncontextmenu" onevent="showMenu()" />

</public:component>

function init(){
   oPopup = window.createPopup();
   var oPopBody = oPopup.document.body;
   //设置菜单样式
   oPopBody.style.backgroundColor = "scrollbar";
   oPopBody.style.border = "2px solid";
   oPopBody.style.borderColor = "buttonhighlight buttonshadow buttonshadow buttonhighlight"
   var strHTML=""
   strHTML+='<table οncοntextmenu="return false;" onselectstart="return false;" id="tbMenu" ';
   strHTML+=' style="cursor:default; width:100%; height:100%;font-size:12px;" border=0 cellpadding=0 cellspacing=2>';
   //在这里扩展菜单的选项start
   strHTML+='<tr operation="edit"><td>  编辑</td></tr>';
   strHTML+='<tr operation="refresh"><td>  刷新</td></tr>';
   strHTML+='<tr operation="addrowup"><td>  添加新行(上)</td></tr>';
   strHTML+='<tr operation="addrowdown"><td>  添加新行(下)</td></tr>';
   strHTML+='<tr operation="delrow"><td>  删除该行</td></tr>';
   strHTML+='<tr operation="moveup"><td>  向上移动一行</td></tr>';
   strHTML+='<tr operation="movedown"><td>  向下移动一行</td></tr>';
   //在这里扩展菜单的选项end
   strHTML+='</table>';

   oPopBody.innerHTML=strHTML;
   var tb = oPopup.document.getElementById("tbMenu");
   var rs=tb.rows;
   for(var i=0;i<rs.length;i++){
      var row=rs[i];
      addEvent(row);
   }
}

function showMenu(){
   var e=window.event;
   var src=e.srcElement;
   oPopup.show(window.event.clientX, window.event.clientY, popWidth, popHeight, document.body);
   window.event.returnValue=false;
}

function addEvent(row){
row.attachEvent("onmouseover",function(){selRow(row)});
row.attachEvent("onclick",function(){onEvent(row)});
}

function selRow(src){
if(curRow!=null){ curRow.style.backgroundColor="scrollbar"; curRow.style.color="black";}
curRow=src; curRow.style.backgroundColor="midnightblue"; curRow.style.color="white";
}

function onEvent(src){
   oPopup.hide();
   switch(src.operation){
      //在这里为菜单项的点击事件添加处理方法
      //本示例的方法只供参考,没有实现
      case "edit": example(src.operation); break;
      case "refresh": example(src.operation); break;
      case "addrowup": example(src.operation); break;
      case "addrowdown": example(src.operation); break;
      case "delrow": example(src.operation); break;
      case "moveup": example(src.operation); break;
      case "movedown": example(src.operation); break;
      default: return;
   }
   src.style.backgroundColor="scrollbar";
   src.style.color="black";
   curRow=null;
}