标签：client als logs cli get lis 坐标 none tle
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style type="text/css"> 7 textarea{ width: 200px;height: 100px;} 8 #menu{width: 50px;background: red; position: absolute; display: none;} 9 </style> 10 </head> 11 <body> 12 <textarea id="text"></textarea> 13 <ul id="menu"> 14 <li>菜单1</li> 15 <li>菜单2</li> 16 <li>菜单3</li> 17 </ul> 18 </body> 19 </html>
<script> //跨浏览器添加事件 function addEvent(obj,type,fn){ if (obj.addEventListener) { obj.addEventListener(type,fn,false); }else if (obj.attachEvent) { obj.attachEvent(‘on‘+ type,fn); } } //清楚默认行为兼容 function preDef (evt) { var e = evt || window.event; if (e.preventDefault) { e.preventDefault(); }else{ e.returnValue = false; } } addEvent(window,‘load‘,function(){ var text = document.getElementById(‘text‘); addEvent(text,‘contextmenu‘,function(evt){ preDef(evt); //取消菜单默认行为 var menu = document.getElementById(‘menu‘); var e = evt || window.event; menu.style.left = e.clientX + "px"; //获取鼠标坐标，定位菜单跟着鼠标走 menu.style.top = e.clientY + "px"; menu.style.display = ‘block‘; addEvent(document,‘click‘,function(){ //鼠标左击隐藏菜单 menu.style.display = ‘none‘; }); }); }); </script>
标签：client als logs cli get lis 坐标 none tle
原文地址：http://www.cnblogs.com/zz334396884/p/7543632.html
