需求说明：

润乾报表的单元格中支持超链接属性，用户可以通过设置该属性，实现在浏览器端用鼠标点击某个单元格跳转到指定页面，并且还能够传递所需要的参数，从而实现数据的钻取（详见 《玩转报表超链接》）。不过这种超链接的设置方式只能跳转到单一的指定页面，在一些特殊的业务要求中，用户可能需要基于一个单元格查看不同的明细信息。比如，用户在访问一个地区列表时，既想经由该页面查看某地区的销售收入情况，又想查看该地区的其他信息。这样，在原有方式下就需要增加多个超链接按钮，每个按钮设置不同的超链接，而这种做法不一定能符合用户的页面样式需要或者操作习惯。下面，通过一个实际例子来介绍一下，如何在页面中增加右键操作，点击右键时先弹出可钻取的列表，选择后跳转到不同的页面。

一：设置报表格式

按照实际需求，开发报表模板，如下图：

报表格式比较简单，是一个比较普通的分组报表，A2 单元格按照国家进行分组，B2 单元格按照省份进行分组，C2 单元格显示出对应的城市名称，报表展现结果如下：

现在要求，在城市列增加右键操作，右键时弹出地址选择列表。

报表单元格有个属性为 HTML 事件属性，可以在该属性中设置 html 触发事件，如在 C2 单元格的 HTML 事件属性表达式中写入：“popMenu 函数，并将 C2 单元格的值传入进行，这样报表中设置了 C2 单元格的右键操作，只需要在显示报表的 jsp 中实现 popMenu 这个 js 函数以及相关操作即可。

二：页面 javascript 设置

在显示报表的 jsp 的 javascript 中实现相应操作，首先，因为页面中要右键操作，所以要先屏蔽掉浏览器本身的右键，在 js 中加入如下代码：

function disClick(){
 return false;
}
document.oncontextmenu=disClick;
接下来的话就是要实现报表中指定的右键操作，整体的js代码如下：
<SCRIPT>
function disClick(){
 return false;
}
document.oncontextmenu=disClick;
var strMenu = "<div id=\\"menu\\" class=\\"clsMenu\\" onMouseover=\\"highlight()\\" onMouseout=\\"lowlight()\\">"
strMenu += "</div>"
// 判断客户端浏览器
function showmenu(){
 var rightedge=document.body.clientWidth-event.clientX
 var bottomedge=document.body.clientHeight-event.clientY
 if (rightedge<menu.offsetWidth)
 menu.style.left=document.body.scrollLeft+event.clientX-menu.offsetWidth
 else
 menu.style.left=document.body.scrollLeft+event.clientX
 if (bottomedge<menu.offsetHeight)
 menu.style.top=document.body.scrollTop+event.clientY-menu.offsetHeight
 else
 menu.style.top=document.body.scrollTop+event.clientY
 menu.style.visibility="visible"
 return false
}
function sysMenu(){
 return false
}
// 隐藏菜单
function hidemenu(){
 menu.style.visibility="hidden"
}
// 菜单项获得焦点时加亮显示
function highlight(){
 if (event.srcElement.className=="menuitems"){
 event.srcElement.style.backgroundColor="highlight"
 event.srcElement.style.color="highlighttext"
}
}
// 菜单项失去焦点
function lowlight(){
 if (event.srcElement.className=="menuitems"){
 event.srcElement.style.backgroundColor=""
 event.srcElement.style.color="menutext"
}
}
function openNewWindow(winhref,winstyle){
  var objNewWindow = window.open(winhref,"",winstyle);
 objNewWindow.focus();
}
 document.write(strMenu);
 function popMenu(cb) {
 var SubstrMenu = "<div class=\\"menuitems\\" onClick=\\"window.open('http://www.baidu.com/s?wd="+cb+"','_self')\\">查“"+cb+"”的所有客户(百度)</div>";
 SubstrMenu += "<div class=\\"menuitems\\" onClick=\\"window.open('http://www.baidu.com/s?wd="+cb+"','_self')\\">查“"+cb+"”的重点客户(百度)</a></div>";
 SubstrMenu += "<hr>";
 SubstrMenu += "<div class=\\"menuitems\\" onClick='hidemenu()'>隐藏此菜单</a></div>";
 menu.innerHTML = SubstrMenu;
 showmenu();
 return false;
 }
</SCRIPT>
另外，为了更好的显示效果，还可以增加css样式来进行控制，将如下样式同样加入到jsp页面中：
```java
<STYLE>.clsMenu {
 BORDER-RIGHT: buttonhighlight 2px outset; BORDER-TOP: buttonhighlight 2px outset; VISIBILITY: hidden; BORDER-LEFT: buttonhighlight 2px outset; WIDTH: 200px; CURSOR: default; COLOR: menutext; BORDER-BOTTOM: buttonhighlight 2px outset; POSITION: absolute; BACKGROUND-COLOR: menu
}
.menuitems {
 PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-SIZE: 12px; COLOR: #000000; LINE-HEIGHT: 18px
}
</STYLE>function disClick(){ return false;
}
document.oncontextmenu=disClick;
接下来的话就是要实现报表中指定的右键操作，整体的js代码如下：
<SCRIPT>function disClick(){ return false;
}
document.oncontextmenu=disClick;
var strMenu = "<div id=\\"menu\\" class=\\"clsMenu\\" onMouseover=\\"highlight()\\" onMouseout=\\"lowlight()\\">"strMenu += "</div>"// 判断客户端浏览器function showmenu(){
 var rightedge=document.body.clientWidth-event.clientX
 var bottomedge=document.body.clientHeight-event.clientY if (rightedge<menu.offsetWidth)
 menu.style.left=document.body.scrollLeft+event.clientX-menu.offsetWidth else
 menu.style.left=document.body.scrollLeft+event.clientX if (bottomedge<menu.offsetHeight)
 menu.style.top=document.body.scrollTop+event.clientY-menu.offsetHeight else
 menu.style.top=document.body.scrollTop+event.clientY
 menu.style.visibility="visible"
 return false}function sysMenu(){ return false}// 隐藏菜单function hidemenu(){
 menu.style.visibility="hidden"}// 菜单项获得焦点时加亮显示function highlight(){ if (event.srcElement.className=="menuitems"){
 event.srcElement.style.backgroundColor="highlight"
 event.srcElement.style.color="highlighttext"}
}// 菜单项失去焦点function lowlight(){ if (event.srcElement.className=="menuitems"){
 event.srcElement.style.backgroundColor=""
 event.srcElement.style.color="menutext"}
}function openNewWindow(winhref,winstyle){
  var objNewWindow = window.open(winhref,"",winstyle);
 objNewWindow.focus();
}
 document.write(strMenu); function popMenu(cb) {
 var SubstrMenu = "<div class=\\"menuitems\\" onClick=\\"window.open('http://www.baidu.com/s?wd="+cb+"','_self')\\">查“"+cb+"”的所有客户(百度)</div>";
 SubstrMenu += "<div class=\\"menuitems\\" onClick=\\"window.open('http://www.baidu.com/s?wd="+cb+"','_self')\\">查“"+cb+"”的重点客户(百度)</a></div>";
 SubstrMenu += "<hr>";
 SubstrMenu += "<div class=\\"menuitems\\" onClick='hidemenu()'>隐藏此菜单</a></div>";
 menu.innerHTML = SubstrMenu;
 showmenu(); return false;
 }
</SCRIPT>
另外，为了更好的显示效果，还可以增加css样式来进行控制，将如下样式同样加入到jsp页面中：
```java
<STYLE>.clsMenu {
 BORDER-RIGHT: buttonhighlight 2px outset; BORDER-TOP: buttonhighlight 2px outset; VISIBILITY: hidden; BORDER-LEFT: buttonhighlight 2px outset; WIDTH: 200px; CURSOR: default; COLOR: menutext; BORDER-BOTTOM: buttonhighlight 2px outset; POSITION: absolute; BACKGROUND-COLOR: menu
}
.menuitems {
 PADDING-RIGHT: 5px; PADDING-LEFT: 5px; FONT-SIZE: 12px; COLOR: #000000; LINE-HEIGHT: 18px
}
</STYLE>

这样，在浏览器端就能够实现在单元格上鼠标右键跳转到不同的链接地址：

注：本例链接地址设置到了百度，实际中跳转可以自行根据实际需求在 js 中进行设置。

总结：

本例中通过报表的 HTML 事件属性实现了单元格的右键跳转到不同的链接地址，报表中除了右键属性外，还支持其他的一些触发事件操作，具体可以参考报表帮助文档： http://doc.raqsoft.com.cn/report/preference/cfsj170.html