js 右鍵菜單，支持不同對象不同菜單(兼容IE、Firefox)

2019-11-21 00:46:55

字體：大中小

來源：轉載

供稿：網友

里面的代碼修改也比較簡單。

<html> <head> <title>ddd</title> <style> .DreamMenu { position:absolute; visibility:hidden; z-index:100; overflow:hidden; width:150px; background-color:buttonface; border:dimgray 1px solid !important; border:buttonhighlight menu menu buttonhighlight 2px outset; padding:1px !important; padding:1px 1px 1px 0px; font-size:12px; } .DreamMenu ul { margin:1px; border-bottom:buttonhighlight 1px solid; border-top:buttonshadow 1px solid; } .DreamMenu a { display:block; width:100%; padding:1px 2px 2px 20px; cursor:default; text-decoration:none; color:#000000; } .DreamMenu a:hover { background:highlight; color:#ffffff; } </style> </head> <body menu='menu'>  <script> /*** DreamCore - JsLib/Menu Date : Dec 03, 2006 Copyright: DreamSoft Co.,Ltd. Mail : Dream@Dreamsoft.Ca Author : Egmax Browser : IE5.0&+,Firefox1.5&+,Netscape7.0&+ Update: ***/ if(!document.all) document.captureEvents(Event.MOUSEDOWN); var _Tmenu = 0; var _Amenu = 0; var _Type = 'A'; document.onclick = _Hidden; function _Hidden() { if(_Tmenu==0) return; document.getElementById(_Tmenu).style.visibility='hidden'; _Tmenu=0; } document.oncontextmenu = function (e) { _Hidden(); var _Obj = document.all ? event.srcElement : e.target; if(_Type.indexOf(_Obj.tagName) == -1) return; _Amenu = _Obj.getAttribute('menu'); if(_Amenu == 'null') return; if(document.all) e = event; _ShowMenu(_Amenu, e); return false; } function _ShowMenu(Eid, event) { var _Menu = document.getElementById(Eid); var _Left = event.clientX + document.body.scrollLeft; var _Top = event.clientY + document.body.scrollTop; _Menu.style.left = _Left.toString() + 'px'; _Menu.style.top = _Top.toString() + 'px'; _Menu.style.visibility = 'visible'; _Tmenu = Eid; } /*** 可以支持其他標簽INPUT,IMG ***/ </script> <script>_Type='INPUT,A,DIV,BODY,IMG';</script>  <div   class="iwvjtn8m0"   id="menu" class='DreamMenu'> <a href='//m.survivalescaperooms.com'>武林網</a> <a > 百度</a> <a >google</a> <a >站長工具</a> <ul></ul> <a href='4'>打印</a> </div>  <div   class="iwvjtn8m0"   id="menu2" class='DreamMenu'> <a href='0'>哈哈</a> <a href='1'>我是個鏈接</a> <a href='2'>好開心啊</a> <a href='3'>查看</a> <ul></ul> <a href='4'>打印</a> </div>  <div   class="iwvjtn8m0"   id="menu3" class='DreamMenu'> <a href='0'>哈哈</a> <a href='1'>我是圖片</a> <a href='2'>雖然打不開</a> <a href='3'>查看</a> <ul></ul> <a href='4'>打印</a> </div> <table><tr><td height=100>  <a href='test.php' menu='menu2'>菜單1</a> <a href='test.php' menu='menu2'>菜單2</a> </td></tr></table> <div style='height:300;' menu='menu'></div> <img src='https://www.jb51.net//m.survivalescaperooms.com/images/logo.gif' menu='menu3'>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一篇：javascript innerText和innerHtml應用

下一篇：使用JavaScript庫還是自己寫代碼？