利用JS重写Cognos右键菜单的实现代码


Posted in Javascript onApril 11, 2010
<!--菜单样式--> 
<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主要是定义菜单的现实样式,其中引用样式为menuitems的div中有个clickcall属性,这个属性就是当点击此菜单项时调用的JS函数,可以将其改为自己的函数,我这里只是简单的调用了个alert。
getObjectName函数中有个cv.id的对象,之前也有人问过这个问题,“cv.id”是干什么用的?cognos报表在ReportStudio运行生成的对象和用URL请求生成的对象名称是不一样的,但是有规律可循,比如利用ReportStudio运行生成的报表中CognosViewer的对象名为oCVRS,而用URL请求生成的cognosViewer对象名为oCV_NS_,大家可以查看两次运行结果的源文件来进行比较,就比较直观了。发现前缀都一样(oCV)只是后面“RS”和“_NS_”不同,页面中很多对象都是用的此规则,而cv.id存储到正是后缀。这样就可以拼凑出当前运行模式下的对象名了。
getRVContent函数获取的是id为RVContent_NS_或RVContentRS的DIV对象,RVContent是展现用ReportStudio定义报表的内容,不包含CognosViewer工具栏和标题栏。
overWriteRightClick函数是将cognos右键调用的函数改为自己定义的函数。
disableRightClick函数已经说过了,禁用右键菜单。
displayContextMenu、hideContextMenu、highLightMenu、lowLightMenu这几个函数都是和菜单操作先关的,可以根据实际要求进行改造。
效果图如下:
利用JS重写Cognos右键菜单的实现代码
Javascript 相关文章推荐
jQuery 打造动态渐变按钮 详细图文教程
Apr 25 Javascript
jQuery源码中的chunker 正则过滤符分析
Jul 31 Javascript
window.open以post方式将内容提交到新窗口
Dec 26 Javascript
JS(JQuery)操作Array的相关方法介绍
Feb 11 Javascript
jQuery实现漂亮实用的商品图片tips提示框效果(无图片箭头+阴影)
Apr 16 Javascript
js严格模式总结(分享)
Aug 22 Javascript
vue-resource拦截器设置头信息的实例
Oct 27 Javascript
vue计算属性及使用详解
Apr 02 Javascript
JS获取本地地址及天气的方法实例小结
May 10 Javascript
JS前端模块化原理与实现方法详解
Mar 17 Javascript
基于PHP pthreads实现多线程代码实例
Jun 24 Javascript
javascript实现电商放大镜效果
Nov 23 Javascript
可以将word转成html的js代码
Apr 11 #Javascript
jquery 表格分页等操作实现代码(pagedown,pageup)
Apr 11 #Javascript
jquery 模拟雅虎首页的点击对话框效果
Apr 11 #Javascript
url 编码 js url传参中文乱码解决方案
Apr 11 #Javascript
jquery学习笔记二 实现可编辑的表格
Apr 09 #Javascript
jquery 图片截取工具jquery.imagecropper.js
Apr 09 #Javascript
跟着JQuery API学Jquery 之三 筛选
Apr 09 #Javascript
You might like
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
php生成验证码函数
2015/10/20 PHP
laravel中的fillable和guarded属性详解
2019/10/23 PHP
js String对象中常用方法小结(字符串操作)
2012/01/27 Javascript
js利用prototype调用Array的slice方法示例
2014/06/09 Javascript
简单实现js菜单栏切换效果
2017/03/04 Javascript
详解nodejs微信jssdk后端接口
2017/05/25 NodeJs
本地存储localStorage用法详解
2017/07/31 Javascript
webpack踩坑之路图片的路径与打包
2017/09/05 Javascript
Vue2.0仿饿了么webapp单页面应用详细步骤
2018/07/08 Javascript
jquery.pagination.js分页使用教程
2018/10/23 jQuery
js实现json数组分组合并操作示例
2019/02/12 Javascript
Vue中遍历数组的新方法实例详解
2019/07/21 Javascript
python 七种邮件内容发送方法实例
2014/04/22 Python
python获取当前日期和时间的方法
2015/04/30 Python
举例讲解Python面向对象编程中类的继承
2016/06/17 Python
常见python正则用法的简单实例
2016/06/21 Python
对numpy中shape的深入理解
2018/06/15 Python
wxPython的安装与使用教程
2018/08/31 Python
实例介绍Python中整型
2019/02/11 Python
利用Python校准本地时间的方法教程
2019/10/31 Python
python 经典数字滤波实例
2019/12/16 Python
Python return语句如何实现结果返回调用
2020/10/15 Python
使用CSS Grid布局实现网格的流动
2014/12/30 HTML / CSS
澳大利亚免息网上购物:Shop Zero
2016/09/17 全球购物
世界上最大的折扣香水店:FragranceNet.com
2016/10/26 全球购物
Ibatis如何使用动态表名
2015/07/12 面试题
C#如何调用Word并打开一个Word文档
2013/05/08 面试题
文秘应聘自荐书范文
2014/02/18 职场文书
幼儿教师自我剖析材料
2014/09/29 职场文书
2014年医院科室工作总结
2014/12/20 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
一文了解MySQL二级索引的查询过程
2022/02/24 MySQL
JVM的类加载器和双亲委派模式你了解吗
2022/03/13 Java/Android
JS前端轻量fabric.js系列物体基类
2022/08/05 Javascript
Flink 侧流输出源码示例解析
2022/09/23 Servers