当然有啦!!要吗?
[email protected]

解决方案 »

  1.   

    方法1:XML技术实现
    ================================
          ** [email protected]  **
    ================================<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312"><style>
      .menu{ cursor: hand; 
             display: none; 
             position: absolute; 
             top: 0; left: 0; 
             overflow: hidden;
             
             background-color: "#CFCFCF"; 
             border: "1 solid"; 
             border-top-color: "#EFEFEF"; 
             border-left-color: "#EFEFEF"; 
             border-right-color: "#505050"; 
             border-bottom-color: "#505050"; 
             font: 10pt 宋体;
             margin:0pt;padding: 2pt
      }  .menu SPAN {width: 100%; cursor: hand; padding-left: 10pt}
      .menu SPAN.selected {background: navy; color:white; cursor: hand}
    </style><xml id="contextDef">
      <xmldata>
        <contextmenu id="demo">
          <item id="viewsource" value="查看源文件"/>
          <item id="back" value="后退……"/>
          <item id="meng" value="访问【孟宪会之精彩世界】"/>
          <item id="calculate" value="执行 JavaScript 代码"/>
        </contextmenu>
        <contextmenu id="demob">
          <item id="菜单项例子1" value="菜单项例子1" />
          <item id="菜单项例子2" value="菜单项例子2" />
        </contextmenu>
      </xmldata>
    </xml><SCRIPT>// 定义全局变量var bContextKey=false;function fnGetContextID(el) {
      while (el!=null) {
        if (el.contextmenu) return el.contextmenu
        el = el.parentElement
      }
      return ""
    }function fnDetermine(){
      oWorkItem=event.srcElement;  //键盘上的菜单键被按下时。
      if(bContextKey==true){
      
        //如果菜单的“状态”为“false”
        
        if(oContextMenu.getAttribute("status")=="false"){
        
          //捕获鼠标事件,以便和页面交互。
          
          oContextMenu.setCapture();      //根据鼠标位置,确定菜单位置。
          
          oContextMenu.style.top=event.clientY + document.body.scrollTop + 1;
          oContextMenu.style.left=event.clientX + document.body.scrollLeft +  1;      oContextMenu.innerHTML="";
          
          //设定菜单的“状态”为“true”
          
          var sContext = fnGetContextID(event.srcElement)
          if (sContext!="") {
            fnPopulate(sContext)
            oContextMenu.setAttribute("status","true");
            event.returnValue=false;
          }
          else
            event.returnValue=true
        }
      }
      else{
      
        // 如果键盘菜单键没有按下,并且菜单的“状态”为“true”。
        
        if(oContextMenu.getAttribute("status")=="true"){
          if((oWorkItem.parentElement.id=="oContextMenu") && (oWorkItem.getAttribute("component")=="menuitem")){
            fnFireContext(oWorkItem)
          }      // 当鼠标离开菜单或单击菜单项后,重设菜单(隐藏)
          
          oContextMenu.style.display="none";
          oContextMenu.setAttribute("status","false");
          oContextMenu.releaseCapture();
          oContextMenu.innerHTML="";
          event.returnValue=false;
        }
      }
    }
        function fnPopulate(sID) {
      var str=""
      var elMenuRoot = document.all.contextDef.XMLDocument.childNodes(0).selectSingleNode('contextmenu[@id="' + sID + '"]')
      if (elMenuRoot) {
        for(var i=0;i<elMenuRoot.childNodes.length;i++)
          str+='<span component="menuitem" menuid="' + 
                elMenuRoot.childNodes[i].getAttribute("id") + 
                '" id=oMenuItem' + i + '>' +  
                elMenuRoot.childNodes[i].getAttribute("value") + 
                "</SPAN><BR>"
        oContextMenu.innerHTML=str;
        oContextMenu.style.display="block";
        oContextMenu.style.pixelHeight = oContextMenu.scrollHeight    
      }
    }function fnChirpOn(){
      if((event.clientX>0) &&(event.clientY>0) &&(event.clientX<document.body.offsetWidth) &&(event.clientY<document.body.offsetHeight)){
        oWorkItem=event.srcElement;
        if(oWorkItem.getAttribute("component")=="menuitem"){
          oWorkItem.className = "selected"
        }
      }
    }
    function fnChirpOff(){
      if((event.clientX>0) && (event.clientY>0) && (event.clientX<document.body.offsetWidth) && (event.clientY<document.body.offsetHeight)){
        oWorkItem=event.srcElement;
        if(oWorkItem.getAttribute("component")=="menuitem"){
          oWorkItem.className = ""
        }
      }
    }function fnInit(){
      if (oContextMenu) {
        oContextMenu.style.width=180;
        oContextMenu.style.height=document.body.offsetHeight/2;
        oContextMenu.style.zIndex=2;
        //设置菜单样式
        document.oncontextmenu=fnSuppress;
      }
    }function fnInContext(el) {
      while (el!=null) {
        if (el.id=="oContextMenu") return true
        el = el.offsetParent
      }
      return false
    }function fnSuppress(){
      if (!(fnInContext(event.srcElement))) { 
        oContextMenu.style.display="none";
        oContextMenu.setAttribute("status","false");
        oContextMenu.releaseCapture();
        bContextKey=true;
      }  fnDetermine();
      bContextKey=false;
    }function javameng(){
    window.open("http://lucky.myrice.com","_blank","width=400,height=400,top=20,left=20")
    }function fnFireContext(oItem) {
      // 自定义上下文菜单项的功能
      switch (oItem.menuid) {
        case "viewsource":
          location.href = "view-source:" + location.href
          break;
        case "back":
          history.back()
          break;
        case "meng":
          location.href="http://lucky.myrice.com"
          break;
        case "calculate":
          javameng()
          break;
        default:
          alert("你点击的菜单项是:\n\n\n" + oItem.menuid +"啊!!!")
      }
    }
    </SCRIPT><BODY onload="fnInit()" onclick="fnDetermine()" bgcolor="#ccffcc">
    <div status="false" onmouseover="fnChirpOn()" onmouseout="fnChirpOff()" id="oContextMenu" class="menu"></div>
    ... 这里放你任意的其他的东西! ...<br>... 这里放你任意的其他的东西! ...<br>... 这里放你任意的其他的东西! ...<br><br>
    <P contextmenu="demo">这里是利用上下文菜单的里子!你把鼠标移动到这里,然后单击鼠标又键,可以看到菜单内容!<br>这里是利用上下文菜单的里子!你把鼠标移动到这里,然后单击鼠标又键,可以看到菜单内容!<br>这里是利用上下文菜单的里子!你把鼠标移动到这里,然后单击鼠标又键,可以看到菜单内容!<br>这里是利用上下文菜单的里子!你把鼠标移动到这里,然后单击鼠标又键,可以看到菜单内容!<br>这里是利用上下文菜单的里子!你把鼠标移动到这里,然后单击鼠标又键,可以看到菜单内容!<br></p>
    <p>你也可以把鼠标放到下面的图象上面,点击又键!<p>
    <center><IMG SRC="http://lucky.myrice.com/javabk1.jpg" contextmenu="demob">
    </body>
    </html>
      

  2.   

    将下面的代码复制到 <body> 内 
    <style>
    <!--
    /*
    Context menu Script- 
    ?Dynamic Drive (www.dynamicdrive.com) Last updated: 00/03/28
    For full source code, 100's more DHTML scripts, and Terms Of Use, 
    visit dynamicdrive.com
    */.skin0{
    position:absolute;
    width:200px;
    border:2px solid black;
    background-color:menu;
    font-family:Verdana;
    line-height:20px;
    cursor:default;
    visibility:hidden;
    }.skin1{
    cursor: default;
    font: menutext;
    position: absolute;
    width: 165px;
    background-color: menu;
    border: 1 solid buttonface;
    visibility:hidden;
    border: 2 outset buttonhighlight;
    }.menuitems{
    padding-left:15px;
    padding-right:10px;
    }
    -->
    </style><script language="JavaScript1.2">
    //set the skin of the menu (0 or 1, with 1 rendering a default Windows menu like skin)
    var menuskin=1//set this variable to 1 if you wish the URLs of the highlighted menu to be displayed in the status bar
    var display_url=0
    function showmenuie5(){
    //Find out how close the mouse is to the corner of the window
    var rightedge=document.body.clientWidth-event.clientX
    var bottomedge=document.body.clientHeight-event.clientY//if the horizontal distance isn't enough to accomodate the width of the context menu
    if (rightedge<ie5menu.offsetWidth)
    //move the horizontal position of the menu to the left by it's width
    ie5menu.style.left=document.body.scrollLeft+event.clientX-ie5menu.offsetWidth
    else
    //position the horizontal position of the menu where the mouse was clicked
    ie5menu.style.left=document.body.scrollLeft+event.clientX//same concept with the vertical position
    if (bottomedge<ie5menu.offsetHeight)
    ie5menu.style.top=document.body.scrollTop+event.clientY-ie5menu.offsetHeight
    else
    ie5menu.style.top=document.body.scrollTop+event.clientYie5menu.style.visibility="visible"
    return false
    }function hidemenuie5(){
    ie5menu.style.visibility="hidden"
    }function highlightie5(){
    if (event.srcElement.className=="menuitems"){
    event.srcElement.style.backgroundColor="highlight"
    event.srcElement.style.color="white"
    if (display_url==1)
    window.status=event.srcElement.url
    }
    }function lowlightie5(){
    if (event.srcElement.className=="menuitems"){
    event.srcElement.style.backgroundColor=""
    event.srcElement.style.color="black"
    window.status=''
    }
    }function jumptoie5(){
    if (event.srcElement.className=="menuitems"){
    if (event.srcElement.getAttribute("target")!=null)
    window.open(event.srcElement.url,event.srcElement.getAttribute("target"))
    else
    window.location=event.srcElement.url
    }
    }
    </script>
    修改下面的代码并复制到 <body> 内 
    <!--[if IE]>
    <div id="ie5menu" class="skin0" onMouseover="highlightie5()" onMouseout="lowlightie5()" onClick="jumptoie5()">
    <div class="menuitems" url="http://dynamicdrive.com">Dynamicdrive.com</div>
    <div class="menuitems" url="http://dynamicdrive.com/new.htm" target="newwin">What's New?</div>
    <div class="menuitems" url="http://dynamicdrive.com/hot.htm">What's Hot?</div>
    <div class="menuitems" url="http://wsabstract.com/cgi-bin/Ultimate.cgi">Message Forum</div>
    <div class="menuitems" url="http://dynamicdrive.com/faqs.htm">FAQs</div>
    <div class="menuitems" url="http://dynamicdrive.com/submitscript.htm">Submit</div>
    <hr>
    <div class="menuitems" url="mailto:[email protected]">Email Us</div>
    </div>
    <![endif]-->
    <script language="JavaScript1.2">
    if (document.all&&window.print){
    if (menuskin==0)
    ie5menu.className="skin0"
    else
    ie5menu.className="skin1"
    document.oncontextmenu=showmenuie5
    document.body.onclick=hidemenuie5
    }
    </script>
      

  3.   

    无忧脚本中多得是http://www.51js.com