利用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 相关文章推荐
javascript 隐藏/显示指定的区域附HTML元素【legend】用法
Mar 05 Javascript
xml文档转换工具,附图表例子(hta)
Nov 17 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
Jul 29 Javascript
jQuery右侧选项卡焦点图片轮播特效代码分享
Sep 05 Javascript
原生js实现图片层叠轮播切换效果
Feb 02 Javascript
Kindeditor在线文本编辑器如何过滤HTML
Apr 14 Javascript
基于WebUploader的文件上传js插件
Aug 19 Javascript
Three.js中网格对象MESH的属性与方法详解
Sep 27 Javascript
在vue项目中安装使用Mint-UI的方法
Dec 27 Javascript
浅谈vue-router 路由传参的方法
Dec 27 Javascript
微信JS-SDK updateAppMessageShareData安卓不能自定义分享详解
Mar 29 Javascript
element-ui表格合并span-method的实现方法
May 21 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定时执行计划任务的多种方法小结
2011/12/19 PHP
深入PHP中慎用双等于(==)的详解
2013/06/06 PHP
php+mysql数据库实现无限分类的方法
2014/12/12 PHP
PHP 使用memcached简单示例分享
2015/03/05 PHP
PHP开发中解决并发问题的几种实现方法分析
2017/11/13 PHP
ThinkPHP5+Layui实现图片上传加预览功能
2018/08/17 PHP
ie focus bug 解决方法
2009/09/03 Javascript
javascript中通过arguments参数伪装方法重载
2014/10/08 Javascript
node.js实现BigPipe详解
2014/12/05 Javascript
js弹出窗口返回值的简单实例
2016/05/28 Javascript
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
vue脚手架搭建过程图解
2018/06/06 Javascript
关于ckeditor在bootstrap中modal中弹框无法输入的解决方法
2019/09/11 Javascript
javascript使用Blob对象实现的下载文件操作示例
2020/04/18 Javascript
Python引用(import)文件夹下的py文件的方法
2014/08/26 Python
用Eclipse写python程序
2018/02/10 Python
Python Web框架之Django框架Model基础详解
2019/08/16 Python
Spring Cloud Feign高级应用实例详解
2019/12/10 Python
代码总结Python2 和 Python3 字符串的区别
2020/01/28 Python
python如何通过闭包实现计算器的功能
2020/02/22 Python
python 实现多维数组(array)排序
2020/02/28 Python
通过python调用adb命令对App进行性能测试方式
2020/04/23 Python
Python实现GIF图倒放
2020/07/16 Python
CSS3网格的三个新特性详解
2014/04/04 HTML / CSS
工商管理应届生求职信
2013/10/07 职场文书
应聘教师推荐信
2013/10/31 职场文书
后勤主管工作职责
2013/12/07 职场文书
生产部管理制度
2014/01/31 职场文书
市场部管理制度
2014/02/02 职场文书
支行行长竞聘演讲稿
2014/05/15 职场文书
任命书范本大全
2014/06/06 职场文书
设立有限责任公司出资协议书
2014/11/01 职场文书
保研推荐信格式
2015/03/25 职场文书
教师节校长致辞
2015/07/31 职场文书
班委竞选稿范文
2015/11/21 职场文书
Python答题卡识别并给出分数的实现代码
2021/06/22 Python