利用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弹出窗口插件 LeanModal的使用方法
Mar 10 Javascript
php+js实现倒计时功能
Jun 02 Javascript
jQuery前端开发35个小技巧
May 24 Javascript
js剪切板应用clipboardData实例解析
May 29 Javascript
jQuery Ajax和getJSON获取后台普通json数据和层级json数据用法分析
Jun 08 Javascript
ajax分页效果(bootstrap模态框)
Jan 23 Javascript
使用javaScript实现鼠标拖拽事件
Apr 03 Javascript
图片加载完成再执行事件的实例
Nov 16 Javascript
解决vue 打包发布去#和页面空白的问题
Sep 04 Javascript
微信小程序后端实现授权登录
Feb 24 Javascript
JavaScript 严格模式(use strict)用法实例分析
Mar 04 Javascript
js Proxy的原理详解
May 25 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得到某段时间区间的时间戳 php定时任务
2012/04/12 PHP
Yii2中使用join、joinwith多表关联查询
2016/06/30 PHP
thinkPHP5.0框架API优化后的友好性分析
2017/03/17 PHP
PHP完全二叉树定义与实现方法示例
2017/10/09 PHP
PHP实现SMTP邮件的发送实例
2018/09/27 PHP
laravel实现Auth认证,登录、注册后的页面回跳方法
2019/09/30 PHP
jQuery实现图片放大预览实现原理及代码
2013/09/12 Javascript
JS的document.all函数使用示例
2013/12/30 Javascript
JavaScript验证电子邮箱的函数
2014/08/22 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
node.js cookie-parser 中间件介绍
2016/06/06 Javascript
Angular ng-repeat 对象和数组遍历实例
2016/09/14 Javascript
JavaScript编写一个简易购物车功能
2016/09/17 Javascript
Angularjs 依赖压缩及自定义过滤器写法
2017/02/04 Javascript
vue.js todolist实现代码
2017/10/29 Javascript
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
2018/03/28 jQuery
微信小程序动态增加按钮组件
2018/09/14 Javascript
微信小程序实现提交input信息到后台的方法示例
2019/01/19 Javascript
JavaScript实现的开关灯泡点击切换特效示例
2019/07/08 Javascript
vue cli3 调用百度翻译API翻译页面的实现示例
2019/09/13 Javascript
KnockoutJS数组比较算法实例详解
2019/11/25 Javascript
解决vuecli3中img src 的引入问题
2020/08/04 Javascript
python中正则表达式的使用详解
2014/10/17 Python
对Python新手编程过程中如何规避一些常见问题的建议
2015/04/01 Python
简单介绍Python中的try和finally和with方法
2015/05/05 Python
Python IDLE入门简介
2017/12/08 Python
Python中Numpy包的安装与使用方法简明教程
2018/07/03 Python
python GUI库图形界面开发之PyQt5布局控件QGridLayout详细使用方法与实例
2020/03/06 Python
pyqt5数据库使用详细教程(打包解决方案)
2020/03/25 Python
Python闭包装饰器使用方法汇总
2020/06/29 Python
HTML5 Web存储方式的localStorage和sessionStorage进行数据本地存储案例应用
2012/12/09 HTML / CSS
皇家道尔顿官网:Royal Doulton
2017/12/06 全球购物
Linux面试经常问的文件系统操作命令
2015/11/05 面试题
诚信考试主题班会
2015/08/17 职场文书
社区结对共建协议书
2016/03/23 职场文书
看古人们是如何赞美老师的?
2019/07/08 职场文书