请教高手了，如何对WEB页面中指定的对像右键弹出自定义的菜单出来？

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

1楼只是是给你个思路,用POPUP做菜单,可以避免被别的控件挡住!
看这个:
<HTML>
<HEAD>
<TITLE>右键菜单</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/><SCRIPT LANGUAGE="JScript">
var pops = new Array();
function CreatePopup(degree)
{
if (degree < 0)
return null;
if (pops[degree] != null)
return pops[degree]; if (degree == 0)
pops[0] = window.createPopup();
else{
if (pops[degree - 1] == null)
pops[degree - 1] = CreatePopup(degree - 1)
pops[degree] = pops[degree - 1].document.parentWindow.createPopup();
}
pops[degree].document.body.setAttribute("degree", degree);
return pops[degree];
}CreatePopup(1);
//Creating the popup window object
var oPopup = pops[0];
var timer = null;
function ContextMenu()
{
    var lefter = event.offsetY+10;
    var topper = event.offsetX+10;
    oPopup.document.body.innerHTML = oContextHTML.innerHTML;
    //This popup is displayed relative to the body of the document.
    oPopup.show(topper, lefter, 200, 65, document.body);
}function ShowSubMenu()
{
ClearTimer();
    pops[1].document.body.innerHTML = oContextHTML1.innerHTML;
    pops[1].show(200, 0, 200, 65, pops[0].document.body);
}function HideSubMenu()
{
ClearTimer();
timer = window.setTimeout("pops[1].hide()", 1000);
}function ClearTimer()
{
if (timer != null)
window.clearTimeout(timer)
timer = null;
}function ShowSubM1()
{
ClearTimer();
pops[1].hide();
    pops[1].document.body.innerHTML = oContextHTML2.innerHTML;
    //This popup is displayed relative to the body of the document.
    pops[1].show(200, 30, 200, 65, pops[0].document.body);
}</SCRIPT></HEAD><BODY>
<img src='aaa.gif' alt='点右键'  onContextMenu="ContextMenu(); return false;"><DIV ID="oContextHTML" STYLE="display:none;">
    <DIV onmouseover="this.style.background='gold';parent.ShowSubMenu()"
         onmouseout="this.style.background='#fff9ff';parent.HideSubMenu()"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand ">
    <SPAN ONCLICK="">
    菜单1</SPAN>
    </DIV>
    <DIV onmouseover="this.style.background='gold';parent.ShowSubM1()"
         onmouseout="this.style.background='#fff9ff';parent.HideSubMenu()"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand; border-top:0px solid black">
    <SPAN ONCLICK="">
    菜单2</SPAN>
    </DIV>
</DIV>
<DIV ID="oContextHTML1" STYLE="display:none;">
    <DIV onmouseover="this.style.background='gold';parent.parent.ClearTimer()"
         onmouseout="this.style.background='#fff9ff';"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand ">
    <SPAN ONCLICK="">
    菜单11</SPAN>
    </DIV>
    <DIV onmouseover="this.style.background='gold';parent.parent.ClearTimer()"
         onmouseout="this.style.background='#fff9ff'"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand; border-top:0px solid black">
    <SPAN ONCLICK="">
    菜单12</SPAN>
    </DIV>
</DIV>
<DIV ID="oContextHTML2" STYLE="display:none;">
    <DIV onmouseover="this.style.background='gold';parent.parent.ClearTimer()"
         onmouseout="this.style.background='#fff9ff';"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand ">
    <SPAN ONCLICK="">
    菜单21</SPAN>
    </DIV>
    <DIV onmouseover="this.style.background='gold';parent.parent.ClearTimer()"
         onmouseout="this.style.background='#fff9ff'"
         STYLE="font-family:verdana; font-size:70%; height:30px; background:#fff9ff; border:1px solid black; padding:4px; cursor:hand; border-top:0px solid black">
    <SPAN ONCLICK="">
    菜单22</SPAN>
    </DIV>
</DIV></BODY>
</HTML>
谢谢 toury，，我要的基本上是这个效果了，非常感谢。呵，
但是还有一个问题想教一下。
我这里也有一个右键的JS，但是它实现的是在网页任何一个地方单击都出自定义菜单，我要的不是这种效果，是你现在做的这种效果，，但是它他出来的右键菜单效果很漂亮，，我想用它菜单的样式效果，但是他的代码我看得不是很懂。。
我现在把我找的这段JS贴出来，，你能帮忙结合一下吗？不胜感激！！！
<STYLE type=text/css>BODY {
FONT-SIZE: 12px;
}
.info{FONT-SIZE: 14px;color:#FFFFFF;font-family:@Tahoma,@宋体;width:20px}
TABLE {
CURSOR: default; FONT-SIZE: 12px; MARGIN: 0px
}
TR {
HEIGHT: 20px
}
TR.over {
BACKGROUND-COLOR: #000080; COLOR: #ffffff; CURSOR: default; FONT-SIZE: 12px
}
TR.out {
BACKGROUND-COLOR: #efefef; COLOR: #000000; FONT-SIZE: 12px
}
DIV.rm_div {
BACKGROUND-COLOR: #efefef; BORDER-BOTTOM: #ffffff 1px outset; BORDER-LEFT: #ffffff 1px outset; BORDER-RIGHT: #ffffff 1px outset; BORDER-TOP: #ffffff 1px outset; DISPLAY: none; FILTER: Alpha(Opacity='95'); HEIGHT: 0px; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; POSITION: absolute; WIDTH: 0px
}
HR.sperator {
BORDER-BOTTOM: #ffffff 1px inset; BORDER-LEFT: #ffffff 1px inset; BORDER-RIGHT: #ffffff 1px inset; BORDER-TOP: #ffffff 1px inset; WIDTH: 95%
}
.w2kfont {
FONT-FAMILY: Tahoma; FONT-SIZE: 8pt
}
</STYLE>
<SCRIPT language=JScript>
\n";
HTMLstr += "\n";
HTMLstr += "\n";
HTMLstr += "<div id='E_rbpm' class='rm_div'>\n";
// rbpm = right button pop menu
HTMLstr += "<table width='100%' border='0' cellspacing='0'>\n";
HTMLstr += "<tr><td height='264' width='20' valign='bottom' bgcolor='#000000' onclick=window.event.cancelBubble=true; class=info>作制娃海<br>:<br>窗视忧无\n";
HTMLstr += "</td><td height='264' width='120' style='padding: 1' valign='bottom'>\n";
HTMLstr += "<table width='100%' border='0' cellspacing='0'>\n";
HTMLstr += "\n";
HTMLstr += "</table></td></tr></table>\n";
HTMLstr += "</div>\n";
HTMLstr += "";
HTMLstr += "\n";
HTMLstr += "\n";
}
function AddExtendMenu(id,img,wh,name,parent)
{
var TempStr = "";
eval("A_"+parent+".length++");
eval("A_"+parent+"[A_"+parent+".length-1] = id"); // 将此项注册到父菜单项的ID数组中去
TempStr += "<div id='E_"+id+"' class='rm_div'>\n";
TempStr += "<table width='100%' border='0' cellspacing='0'>\n";
TempStr += "";
TempStr += "</table>\n";
TempStr += "</div>\n";
TempStr += "";
TempStr += "";
HTMLstr = HTMLstr.replace("",TempStr); eval("A_"+id+" = new Array()");
TempStr = "";
TempStr += "\n";
TempStr += "<tr id='P_"+id+"' class='out'";
TempStr += " onmouseover='P_OnMouseOver(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseout='P_OnMouseOut(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseup=window.event.cancelBubble=true;";
TempStr += " onclick=window.event.cancelBubble=true;";
TempStr += "><td nowrap>";
TempStr += "<font face='Wingdings' style='font-size:18px'>0</font> "+name+" </td><td style='font-family: webdings; text-align: ;'>4";
TempStr += "</td></tr>\n";
TempStr += "";
HTMLstr = HTMLstr.replace("",TempStr);
}
function AddItem(id,img,wh,name,parent,location)
{
var TempStr = "";
var ItemStr = "";
if(id == "sperator")
{
TempStr += ItemStr+"\n";
TempStr += "<tr class='out' onclick='window.event.cancelBubble=true;' onmouseup='window.event.cancelBubble=true;'><td colspan='2' height='1'><hr class='sperator'></td></tr>";
TempStr += "";
HTMLstr = HTMLstr.replace("",TempStr);
return;
}
if(HTMLstr.indexOf(ItemStr) != -1)
{
alert("I_"+id+"already exist!");
return;
}
TempStr += ItemStr+"\n";
TempStr += "<tr id='I_"+id+"' class='out'";
TempStr += " onmouseover='I_OnMouseOver(\""+id+"\",\""+parent+"\")'";
TempStr += " onmouseout='I_OnMouseOut(\""+id+"\")'";
TempStr += " onclick='window.event.cancelBubble=true;'";
if(location == null)
TempStr += " onmouseup='I_OnMouseUp(\""+id+"\",\""+parent+"\",null)'";
else
TempStr += " onmouseup='I_OnMouseUp(\""+id+"\",\""+parent+"\",\""+location+"\")'";
TempStr += "><td nowrap>";
TempStr +="<font face='Wingdings' style='font-size:18px'>"+wh+"</font> "+ name+" ";
TempStr += "</td><td></td></tr>\n";
TempStr += "";
HTMLstr = HTMLstr.replace("",TempStr);
}
接上面的function GetMenu()
{
return HTMLstr;
}
function I_OnMouseOver(id,parent)
{
var Item;
if(parent != "rbpm")
{
var ParentItem;
ParentItem = eval("P_"+parent);
ParentItem.className="over";
}
Item = eval("I_"+id);
Item.className="over";
HideAll(parent,1);
}
function I_OnMouseOut(id)
{
var Item;
Item = eval("I_"+id);
Item.className="out";
}
function I_OnMouseUp(id,parent,location)
{
var ParentMenu;
window.event.cancelBubble=true;
OnClick();
ParentMenu = eval("E_"+parent);
ParentMenu.display="none";
if(location == null)
eval("Do_"+id+"()");
else
window.open(location);
}
function P_OnMouseOver(id,parent)
{
var Item;
var Extend;
var Parent;
if(parent != "rbpm")
{
var ParentItem;
ParentItem = eval("P_"+parent);
ParentItem.className="over";
}
HideAll(parent,1);
Item = eval("P_"+id);
Extend = eval("E_"+id);
Parent = eval("E_"+parent);
Item.className="over";
Extend.style.display="block";
Extend.style.posLeft=document.body.scrollLeft+Parent.offsetLeft+Parent.offsetWidth-4;
if(Extend.style.posLeft+Extend.offsetWidth > document.body.scrollLeft+document.body.clientWidth)
Extend.style.posLeft=Extend.style.posLeft-Parent.offsetWidth-Extend.offsetWidth+8;
if(Extend.style.posLeft < 0) Extend.style.posLeft=document.body.scrollLeft+Parent.offsetLeft+Parent.offsetWidth;
Extend.style.posTop=Parent.offsetTop+Item.offsetTop+1;
if(Extend.style.posTop+Extend.offsetHeight > document.body.scrollTop+document.body.clientHeight)
Extend.style.posTop=document.body.scrollTop+document.body.clientHeight-Extend.offsetHeight;
if(Extend.style.posTop < 0) Extend.style.posTop=0;
}
function P_OnMouseOut(id,parent)
{
}
function HideAll(id,flag)
{
var Area;
var Temp;
var i;
if(!flag)
{
Temp = eval("E_"+id);
Temp.style.display="none";
}
Area = eval("A_"+id);
if(Area.length)
{
for(i=0; i < Area.length; i++)
{
HideAll(Area[i],0);
Temp = eval("E_"+Area[i]);
Temp.style.display="none";
Temp = eval("P_"+Area[i]);
Temp.className="out";
}
}
}
document.onmouseup=OnMouseUp;
document.onclick=OnClick;
function OnMouseUp()
{
if(window.event.button == 2)
{
var PopMenu;
PopMenu = eval("E_rbpm");
HideAll("rbpm",0);
PopMenu.style.display="block";
PopMenu.style.posLeft=document.body.scrollLeft+window.event.clientX;
PopMenu.style.posTop=document.body.scrollTop+window.event.clientY;
if(PopMenu.style.posLeft+PopMenu.offsetWidth > document.body.scrollLeft+document.body.clientWidth)
PopMenu.style.posLeft=document.body.scrollLeft+document.body.clientWidth-PopMenu.offsetWidth;
if(PopMenu.style.posLeft < 0) PopMenu.style.posLeft=0;
if(PopMenu.style.posTop+PopMenu.offsetHeight > document.body.scrollTop+document.body.clientHeight)
PopMenu.style.posTop=document.body.scrollTop+document.body.clientHeight-PopMenu.offsetHeight;
if(PopMenu.style.posTop < 0) PopMenu.style.posTop=0;
}
}
function OnClick()
{
HideAll("rbpm",0);
}
// Add Your Function on following
function Do_viewcode(){window.location="view-source:"+window.location.href;}
function Do_help(){window.showHelp(window.location);}
function Do_exit() {window.close();}
function Do_refresh() {window.location.reload();}
function Do_back() {history.back();}
function Do_forward() {history.forward();}
function Do_help(){
var s_help='<style>body,td{font:menu;padding:2}</style>';
s_help+='<title>帮助</title>';
s_help+='<body bgcolor=menu>';
s_help+='<br> 欢迎光临无忧视窗！本系统和您的Windows系统操作很相似。单击开始，打开开始菜单，双击桌面图标打开相关文件！<span style="color:blue;cursor:hand" onclick=showHelp("windows.chm::/MS-ITS:ntdef.chm::/default.htm")>本机帮助..</span>';
showModalDialog("about:"+s_help+"","","dialogHeight:110px;dialogWidth:210px;help:yes;status:no")}
-->
</SCRIPT>
<META content="MSHTML 5.00.2920.0" name=GENERATOR></HEAD>
<BODY bgColor=#336699 oncontextmenu=window.event.returnValue=false>
<DIV id=snwcwt> 请点击右键</DIV>
<SCRIPT language=JScript>

</SCRIPT>
</TD></TR></TABLE>
Q1:你的代码:
<BODY bgColor=#336699 ~~oncontextmenu=window.event.returnValue=false~~>就OK了;
Q2:"只需要的单击右键菜单出来第一级菜单就可以了"
那你简单的修改一下嘛,不要懒啊兄弟;别人帮你写代码对你没什么好处;计算机编程本身就是要求动手动脑的呀;
实践出真知!!呵呵