时间:2021-05-25
复制代码 代码如下:
<!--菜单样式-->
<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;");
}
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";
}
}
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这几个函数都是和菜单操作先关的,可以根据实际要求进行改造。
效果图如下:
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
下面先给大家介绍下js实现的右键菜单功能,具体详情如下所示:这一章解决的问题1、实现右键菜单功能代码。2、阻止默认事件的实际应用。右键菜单#menu{posit
本文实例讲述了JS实现的自定义右键菜单。分享给大家供大家参考。具体如下:示例1:运行效果截图:具体代码如下:JS实现自定义右键菜单#container{text
加入了右击TAB选项卡时显示关闭的上下文菜单具体实现代码:右键菜单HTML:关闭全部关闭除此之外全部关闭当前页右侧全部关闭当前页左侧全部关闭下面是js代码:$(
本文实例为大家分享了js实现右键菜单的具体代码,供大家参考,具体内容如下原理:1.屏蔽默认的右键菜单2.点击右键获取位置,让自定义菜单到点击位置上3.点击左键,
js代码如下:复制代码代码如下://禁用右键菜单document.oncontextmenu=ContextMenu;//鼠标右击事件functionConte