浏览器上实现右键菜单的方法

2019-10-25 06:30:53来源：爱站网阅读 ()

　　?最近有程序猿给小编提出如何在浏览器中实现类似于应用程序的右键菜单的效果，小编在尝试一番后，发现实现方法并不是很难，那么现在就让小编为大家介绍浏览器上实现右键菜单的方法。
　　首先要解决的问题是在怎样的情况鼠标右击不会出现IE的菜单。思路可以有两个，一个是将焦点移开，还有一个就是点在网页的什么地方不会出现右键菜单，而且会响应鼠标点击消息。（哈哈，废话一大堆。思路吗？总要多想想才有的）?

想了想,?总结出的下面几种方法
1、响应右键消息出一个ALERT框（还有点新鲜的东东没有）。?
2、响应右键消息后弹出一个新的窗口。将初始页的的焦点移开。?
可是经过试验后发现只有窗口出现在鼠标右击的位置时，才会没有浏览器的右键菜单出现。?
3、响应右键消息后弹出一个HTML的对话框。即使用showModalDialog来开启一个HTML对话框。使用这种方式可以让右键菜单不会出现。但是有一个问题是使用使用showModalDialog开启的对话框不会向使用Window.Open开启的对话框一样可以移出屏幕所在的范围。就是说始终可以看见有一个对话框出现在屏幕上。这条路也不能走了。?
4、呵呵，最后一招了，唯鱼偶尔发现在Select上进行鼠标右击或左击都不会有反应。那么如果每次鼠标都点在Select上，不就不会出现浏览器的右键菜单了。?

下面就是一个例子，感兴趣的可以把下面的拷贝成Test.html，就可以看看效果了。

<?HTML>?

<?title>VFish?Test<?/title>?

<?script>?

var?x,?y;?

document.onmousemove=moveMouse?

document.onmousedown=click?

function?moveMouse()?

{?

Layer1.style.left?=?event.clientX?-?2;?

Layer1.style.top?=?event.clientY?-?2;?

}?

function?click()?

{?

if?(event.button==2)?

{?

x?=?event.clientX;?

y?=?event.clientY;?

Layer1.style.visibility="";?

window.setTimeout("showMenu();",?500);?

}?

else?

{?

HiddenPop();?

PopMenu.style.visibility='hidden';?

}?

}?

function?showMenu()?

{?

PopMenu.style.left?=?x-?2;?

PopMenu.style.top?=?y-?2;?

PopMenu.style.visibility="";?

HiddenPop();?

}?

function?HiddenPop()?

{?

Layer1.style.visibility='hidden';?

}?

<?/script>?

<?BODY>?

在窗口中右击一下看看出什么:)?

<?div?id=Layer1?style="position:absolute;?width:4px;?height:4px;?z-index:3;?visibility:?hidden">?

<?select?style="width:4"><?/select>?

<?/div>?

<?div?id=PopMenu?style="position:absolute;?width:100px;?height:100px;?z-index:1;?visibility:?hidden">?

<?table?border=2?width=100?>?

<?TH?align="center"?color="sliver"?onclick="">?

唯鱼的菜单?

<?/tH>?

<?tr>?

<?td>?

click?it!:)?

<?/td>?

<?/tr>?

<?/table>?

<?/div>?

<?/BODY>?

<?/HTML>