JavaScript重写Cognos Viewer右键菜单实现方案

 
定义菜单的CSS样式部分。
<STYLE type=text/css>
.cMenu {
BORDER-RIGHT: #000000 1px solid;
BORDER-TOP: #000000 1px solid;
FONT-WEIGHT: normal;
FONT-SIZE: 14px;
VISIBILITY: hidden;
BORDER-LEFT: #000000 1px solid;
WIDTH: 150px;
CURSOR: default;
COLOR: #000000;
LINE-HEIGHT: 20px;
BORDER-BOTTOM: #000000 1px solid;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
POSITION: absolute;
BACKGROUND-COLOR: #eeeeff
} 
.menuitems {
PADDING-RIGHT: 5px;
PADDING-LEFT: 5px
} 
</STYLE>
<DIV class=cMenu id="contextMenu" onmouseover=highLightMenu() onmouseout=lowLightMenu()>
<DIV class=menuitems clickcall="alert('查看历史执行情况');">查看历史执行情况</DIV>
<DIV class=menuitems clickcall="alert('查看批注');">查看批注</DIV>
<DIV class=menuitems clickcall="alert('插入/修改批注');">插入/修改批注</DIV>
<HR color=#aaaaaa size="0">
<DIV class=menuitems clickcall="alert('关于');">关于</DIV>
</DIV>
<SCRIPT type="text/javascript">
var contextMenu = document.getElementById("contextMenu");
function getObjectName()
{ 
return document.getElementById("cv.id").value;
} 
function getRVContent()
{ 
var objName = getObjectName();
return eval("document.getElementById('RVContent" + objName + "');");
} 
function overWriteRightClick()//重写弹出菜单
{ 
var objName = getObjectName();
eval("oCV" + objName + ".rvMainWnd.displayContextMenu = displayContextMenu;");
} 
function disableRightClick()
{ 
var objName = getObjectName();
eval("oCV" + objName + ".bCanUseCognosViewerContextMenu = false;");
} 
/* 菜单相关函数 start*/
function displayContextMenu(evt) {
evt = (evt) ? evt : ((event) ? event : null);
hideContextMenu();
var rightedge = getRVContent().clientWidth - evt.clientX;
var bottomedge = getRVContent().clientHeight - evt.clientY;
if (rightedge < contextMenu.offsetWidth)
contextMenu.style.left = getRVContent().scrollLeft + evt.clientX - contextMenu.offsetWidth - getRVContent().offsetLeft;
else
contextMenu.style.left = getRVContent().scrollLeft + evt.clientX - getRVContent().offsetLeft;
if (bottomedge < contextMenu.offsetHeight)
contextMenu.style.top = getRVContent().scrollTop + evt.clientY - contextMenu.offsetHeight - getRVContent().offsetTop;
else
contextMenu.style.top = getRVContent().scrollTop + evt.clientY - getRVContent().offsetTop;
contextMenu.style.visibility = "visible";
return false;
} 
function hideContextMenu() {
var object = event.srcElement;
contextMenu.style.visibility = "hidden";
if (object.className == "menuitems") {
eval(object.clickcall);
} 
} 
function highLightMenu() {
var object = event.srcElement;
if (object.className == "menuitems") {
object.style.backgroundColor = "highlight";
object.style.color = "white";
} 
} 
function lowLightMenu() {
var object = event.srcElement;
if (object.className == "menuitems") {
object.style.backgroundColor = "";
object.style.color = "black";
} 
} 
/*菜单相关函数 end*/
overWriteRightClick();
document.body.onclick = hideContextMenu;
</SCRIPT>

代码逻辑与对象命名解析

上述代码中，前部的style和div标签主要用于定义菜单的显示样式。其中，class为menuitems的div元素包含一个clickcall属性，该属性指定了点击菜单项时执行的JavaScript函数。开发者可根据需求将其替换为自定义逻辑，示例中仅使用了简单的alert弹窗进行演示。

在getObjectName函数中，通过获取cv.id对象的值来确定报表实例标识。Cognos报表在ReportStudio直接运行与通过URL请求生成时，其对象命名规则存在差异但具有规律性。例如，ReportStudio生成的报表中CognosViewer对象名通常以oCVRS为前缀，而URL请求生成的对象名则以oCV_NS_为前缀。通过对比运行结果的源文件可以直观发现，两者前缀均为oCV，区别仅在于后缀部分。cv.id变量存储的正是这一后缀信息，利用该后缀拼接即可准确获取当前运行模式下的完整对象名。

getRVContent函数的作用是获取id为RVContent_NS_或RVContentRS的DIV对象。该容器用于展示由ReportStudio定义的报表内容，但不包含CognosViewer的工具栏和标题栏区域。

overWriteRightClick函数的核心功能是将Cognos默认的右键调用逻辑替换为用户自定义的函数，从而实现菜单行为的定制。

disableRightClick函数用于禁用Cognos原生的右键菜单功能，确保自定义菜单能够正常触发。

displayContextMenu、hideContextMenu、highLightMenu以及lowLightMenu这几个函数分别负责菜单的显示定位、隐藏、高亮选中项及取消高亮操作。开发者可根据实际业务需求对这些交互逻辑进行改造和扩展。

最终实现的菜单效果如下图所示：