Opera下自定义右键菜单的研究

1351次阅读  |  发布于5年以前

Opera是一个来自挪威的浏览器,有着优秀的缓存机制,浏览网页速度很快,有着自己庞大的粉丝群。但是opera并没有支持上下文菜单事件,也就是说我们通常使用的 依靠在页面中重写oncontextmenu事件来实现自定义右键菜单的方法不会工作。那么,有没有别的方法来实现自定义菜单呢?

我们来看看三个著名的产品(Fckeditor、YUI、Google Doc)怎么解决opera没有oncontextmenu事件这个问题:

Fckeditor:Fckeditor这个开源的编辑器我想不用多介绍了吧,它的最新版本已经支持了opera。那么它是怎么处理右键菜单的呢?分析源码可以知道, 它注册了onmousedown事件,并且判断鼠标按下的是不是右键,如果是就显示自定义菜单。这样看似很完美,但是有两个致命的弱点:1.默认情况下opera是不 检测鼠标右键点击的,也就是右键按下时根本不触发mousedown事件。除非在"工具"-"首选项"-"高级"-"内容"-"Javascript选项"中勾选"允 许脚本检测右键单击";2.opera自身的上下文菜单会跟自定义菜单一起出现,也就是说无法preventDefault。这个问题解决起来有一点点巧妙,经过实验 我们可以发现,opera下在type等于button的input上点击右键不会出现系统上下文菜单,于是我们可以在mousedown时在鼠标下放一个几乎透明的 type=button的input,再在mouseup的时候隐藏这个button。

YUI的MENU组件:YUI是一个先进的界面库,功能强大,使用简便。那么他是怎么解决这个问题的呢?相比于FCKEditor,YUI换了另外一种思路,既然Op era默认不支持检测右键点击,那就用左键点击来代替总可以吧,但是这样显然会干扰用户正常操作,于是YUI又加了一条规则,按下ctrl键的同时点击左键才等同于右 键。"Hold down the control key and click with the left mouse button."

Google Doc:Google出品的web office套件。Google的技术不用怀疑,那么他是怎么解决这个问题的呢?答案是:既然不能完美解决,干脆就不解决。反正Google Doc的所有操作都不是只有右键菜单才能完成。不愧是Google!

本文提到的两种解决方案实现代码

Copyright© 2013-2020

All Rights Reserved 京ICP备2023019179号-8